Структура HTML-документа, обязательные теги
На этом уроке вы узнаете:
- Что такое директива DOCTYPE.
- Структуру HTML-страницы.
- Обязательные теги HTML-страницы.
Язык HTML не является языком программирования - это язык разметки, поэтому HTML учится быстро и легко.
Теги и их атрибуты не чувствительны к регситру.
HTML-страницу рекомендуется начинать с директивы DOCTYPE, которая сообщает браузеру какая версия HTML использовалась при написании страницы. Общепринятым стандартом на 2015 год считается версия HTML5. В HTML5 версия в DOCTYPE не указывается, что упрощает переход на HTML5 со старых версий. Например, если HTML-страница соответствует стандарту HTML4, то для перехода на HTML5 достаточно изменить DOCTYPE.
ПРИМЕР:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> - HTML4 <!DOCTYPE HTML> - HTML5 |
Все браузеры поддерживают сокращенное объявление DOCTYPE и отображают HTML-страницу в соответствии со стандартом. Различия между версиями HTML приведены на странице w3.org/TR/html5-diff/#doctype
HTML-страница содержит обязательные теги, которые располагаются в строгом порядке.
ПРИМЕР:
<!DOCTYPE HTML> <html> <head> <title>НАЗВАНИЕ HTML-страницы</title> </head> <body> Текст HTML-страницы. </body> </html> |
- Контейнер HTML определяет начало и конец HTML-страницы.
- Контейнер HEAD определяет головную часть HTML-страницы.
- Контейнер TITLE содержит название HTML-страницы.
- Контейнер BODY содержит информацию, которая отображается в окне браузера.
Теорию будем дополнять практикой.
- Откройте текстовый редактор Notepad++ (или HTML-редактор, если он у вас есть).
- Наберите текст примера, который приведен выше:
- В контейнере TITLE запишите - Урок 1.
- В контейнере BODY запишите - Моя первая HTML-страница.
- Сохраните пример в файл lesson1.html на диск D своего компьютера.
- Запустите браузер, который установлен на вашем компьютере (например Internet Explorer).
- В командной строке браузера наберите D:/lesson1.html и нажмите клавишу Enter.
- Посмотрите как выглядит HTML-страница.
Поздравляю, только что вы создали настоящую Веб-страницу. Согласитесь, это было не сложно.
ВАЖНО!
|
