Posted by Виктория Павловна Дончик | Posted in Web-дизайн, Web-разработки, Интернет | Posted on 13-02-2015
Метки: html-код
Урок 2. Теги и атрибуты HTML
На предыдущем занятии мы уже познакомились со структурой HTML-документа, начали знакомиться с тегами и создали простую HTML-страничку. На этом занятии мы узнаем о тегах и атрибутах, создадим несколько html-страниц, выполним форматирование Web-страниц в HTML-коде.
Прежде, чем разбирать атрибуты тегов, давайте ответим на вопросы: «Что такое HTML-теги? Как записываются HTML-теги? Какие HTML-теги бывают?»
- HTML-теги – это метки, которые мы используем, чтобы показать браузеру, как отобразить данные на веб-страничке.
- При записи теги обрамляем угловыми скобками, например <html>.
- Теги бывают парные, например, <html> и </html>. Между парными тегам нужно размещать данные веб-страницы.
- Есть теги одиночные, например, <br>. Одиночные теги текста не содержат.
В каком регистре писать теги? Как правильно <br> или <Br> или <BR>? HTML язык регистронезависимый, т.е. браузерам все равно в каком регистре написаны теги. Корректно писать все теги в нижнем регистре.
Чтобы расширить возможности форматирования, многие из тегов имеют атрибуты. Например,
- <p align="center"> Весна идет … </p> Текст «Весна идет» будет расположен по центру, т.к. для тега абзаца <p> задан атрибут align="center".
Есть теги, которые нужно использовать только с атрибутами, например
- <img src= "1.jpg">, иначе браузер не отобразит картинку.
Общий синтаксис тега с атрибутами такой:
<имя-тега атрибут1="значение1" атрибут2="значение2" ...>
Предлагаю ознакомиться с видеоматериалом "Теги и атрибуты" и выполнить Практикум:
Практикум.
Задание 1. Создать html-страничку pr2_fio_poet1.html. Написать стихотворение. Применить разные блочные теги форматирования.
Задание 2. Создать html-страничку pr2_fio_poet2.html. Написать стихотворение. Применить разные теги форматирования строчными элементами.
Задание 3. Найти в Интернете рецепт. Сделать скрин. Создать веб-страницу pr2_fio_recept.html по найденному примеру. Обязатльно использовать на html-странице картинку, текст, ненумерованный список, горизонтальную линию, заголовки разного уровня.
Повторим материал занятия "Теги и атрибуты HTML":
- Перечислите и прокомментируйте теги верхнего уровня.
- Как в html-документе сделать заголовок?
- Сколько уровней заголовка определено в html?
- Какие блочные элементы знаете?
- Для чего служат строчные элементы?
- Сравнить теги <p> и <br>
- Сравнить блочные и строчные элементы.
Ответы на вопросы записать в конспект. Отчет по практикуму разместить в GD.
Кстати,
- При работе с тегами и атрибутами рекомендую использовать онлайн справочник http://htmlbook.ru/
- Потренироваться в использовании тегов и атрибутов можно на сайте: http://htmlacademy.ru
Кстати, на первом уроке "Введение в HTML" мы узнали что такое HTML, какая версия HTML используется сегодня и какую структуру имеют html-документы.
Следующий урок будет по спискам. Заходите и изучайте "Списки в HTML".
очень хорошие у вас уроки, доступно в применении, будем пользоваться, спасибо!
Спасибо, Елена. Пользуйтесь на здоровье!
Виктория Павловна Дончик Как конвертировать презентацию в PDF-формат?