Вредоносное ПО (malware) - это назойливые или опасные программы,...
Тег отвечает за тип документа в HTML (DTD "document type definition", описание типа документа). Если быть точнее, то это инструкция для браузера, что за тип документа представлен ниже.
Возникает логичный вопрос: а что html разве бывает разный? Дело в том, что в разных версиях html появлялись новые теги. Также и в CSS появлялись новые свойства. Чтобы браузер корректно смог понять какому стандарту соответствует страница, рекомендуется четко указывать тип документа в .
Располагается в самом начале html-кода (перед тегом ).
Синтаксис
Элемент верхнего уровня ] [Публичность ] "[Регистрация ]//[Организация ]//[Тип ] [Имя ]//[Язык ]" ""> ...
- Элемент верхнего уровня - элемент верхнего уровня в документе (для HTML это тег )
- Публичность - значение PUBLIC (объект является публичным) или SYSTEM (системным ресурсом). Например, таким как локальный файл. Для HTML/XHTML указывается значение PUBLIC.
- Регистрация - принимает одно из двух значений: плюс (+) - разработчик зарегистрирован в ISO и минус (-) - разработчик не зарегистрирован. Для W3C значение ставится минус.
- Организация - уникальное название организации, разработавшей DTD. Официально HTML/XHTML публикует W3C, это название и пишется в .
- Тип - тип описываемого документа (для HTML/XHTML значение DTD).
- Имя - уникальное имя документа для описания DTD.
- Язык - язык, на котором написан текст для описания объекта. Содержит две буквы, пишется в верхнем регистре. Например, EN.
- URL - адрес документа с DTD.
Рассмотрим какие стандартные значения встречаются чаще всего.
Таблица со значениями и описания к ним
DOCTYPE | Описание |
Строгий синтаксис HTML | |
Переходный синтаксис HTML | |
В HTML-документе применяются фреймы | |
Стандарт HTML5. Для всех документов. Рекомендуется использовать его на своих сайтах. | |
Строгий синтаксис XHTML. Включает все HTML элементы и атрибуты, кроме устаревших презентационных. Фреймсеты также не разрешены. | |
Переходный синтаксис XHTML. Включает все HTML элементы и атрибуты, вместе с устаревшими презентационными. Фреймсеты не разрешены. | |
Тоже что и XHTML 1.0 Transitional, но разрешает фреймы. | |
Тоже что и XHTML 1.0 Strict, но разрешает добавление модулей. |
Какой выбрать
Подводя итоги можно сказать, что не является обязательным элементом, но его использование снижает риски возникновения проблем с отображением html-страницы в разных браузерах.
Фактически всем подойдет следующий вариант:
...
Сегодня приступим к изучению html и css. Данную тему я постараюсь раскрыть максимально понятно, для любого читателя. И не имеет значения: знакомы вы с этой темой или только имеете желание изучить код, который довольно широко используется в сайтостроении. И чтобы затронуть, как можно больше примеров применения и использования кода, я планирую написать весьма внушительный список статей, посвященных , без использования, каких либо cms, или же комбинируя html-странички с движками dle и wordpress. Разбирать вопросы мы будем по мере их поступления, а не в традиционном стиле, сначала теория, а потом практика. Я сразу покажу все на практике, подкрепляя все теорией.
Но начнем, конечно же, сначала. То есть с того, что такое html? И другого немаловажного вопроса: «Зачем нужен doctype и какой выбрать?» Собственно, это и тема, сегодняшнего поста.
Что такое html?
Html — это аббревиатура языка разметки гипертекста: «HyperText Markup Language», которая определяет расположение элементов на веб-странице и их оформление. Данный язык никак не ограничивает вебмастера, в его фантазии и позволяет создавать практически любую структуру и оформление страницы. Вообщем, если вы решили посвятить себя созданию сайтов, вы должны обязательно знать html-код. Сложного в нем ничего нет, и я надеюсь, что по итогам цикла статей, вы в этом убедитесь.
Любой код веб-сайта начинается с определения типа документа (DTD — document type definition(описание типа документа)) браузерами, для корректного отображения сайта на экранах наших мониторов. А чтобы помочь браузеру определиться, необходимо указать тип документа, который используется на сайте. Для этого, существует тег
DOCTYPE | Описание |
HTML 4.01 | |
Строгий синтаксис HTML. | |
Переходный синтаксис HTML. | |
HTML-документ, с применением фреймов. | |
HTML 5 | |
Для всех документов. | |
XHTML 1.0 | |
Строгий синтаксис XHTML. | |
Переходный синтаксис XHTML. | |
XHTML-документ, с применением фреймов. | |
XHTML 1.1 | |
Такой же, как и строгий синтаксис XHTML, но допускается добавление модулей. |
Теперь, попробуем разобрать по кусочками, что же содержит DOCTYPE.
html — указывает элемент верхнего уровня, то есть самую основу кода. Для HTML, это тег .
PUBLIC — определяет публичность документа. Данный тип документа является публичным.
«-» — указывает, зарегистрирован или нет разработчик типа документа в международной организации по стандартизации (International Organization for Standardization, ISO). Имеет два значения: минус или плюс. Минус — не зарегистрирован. Плюс — зарегистрирован. Но для W3C, указывается «-»
W3C — организация разработавшая DTD.
DTD — тип документа. Для HTML и XHTML указывается DTD.
HTML 4.01 Transitional (как пример) — имя документа, его версия и синтаксис, который он использует.
EN — язык на котором написан документ. И естественно, HTML и XHTML используют английский язык.
http://www.w3.org/TR/html4/loose.dtd — адрес документа с описанием документа (DTD).
Вот столько информации несет в себе самая первая строка HTML или XHTML кода. Но все же могут возникнуть проблемы с определением насколько соответствует наш документ выбранному синтаксису или нет. Для этого, существует валидатор разметки, который поможет нам определить на сколько валиден (правильный) наш код. Валидатор предоставляется той же организацией. которая является официальным разработчиком DTD. Находится он на сайте http://validator.w3.org/ .
Итак, нам остается только определиться с выбором. И выбрать
На этом у меня все. Надеюсь, данный пост будет полезен И поможет разобраться в вопросе, о DOCTYPE.
Приветствую Вас, уважаемые читатели! Сегодня короткий материал о специальном теге doctype. В статье вы узнаете что такое doctype, зачем он нужен и какие бывают версии html-документов.
В любом правильном html-документе, первым элементом в коде идет специальная директива .
Что такое DOCTYPE и зачем он нужен
Элемент — DTD (document type definition, описание типа документа) указывает тип документа, который используется при написании html кода. Это непарный тег, который должен стоять самым первым в коде каждой страницы вашего сайта.
Директива doctype необходима, чтобы браузер понимал как обрабатывать текущую веб-страничку, так как существует несколько версий языка HTML, а еще имеется XHTML (EXtensible HyperText Markup Language, расширенный язык разметки гипертекста), который похож на HTML, но различается с ним по синтаксису.
Поэтому если вы хотите, чтобы ваш сайт отображался одинаково красиво и ровно во всех популярных браузерах, то обязательно указывайте эту директиву с версией языка html, которую вы используете. Причем doctype следует указывать с общепринятыми правилами.
Если вы будете пользоваться неполным тегом DOCTYPE, устаревшим его видом, или вообще забудете про него, то браузер перейдет в хитрый режим уловок - quirks mode . И возможно странички вашего сайта отобразятся правильно в каких-то браузерах, но не факт, что они будут выглядеть также аккуратно в других популярных браузерах.
Основные типы документов
Ниже приведены основные типы документов:
DOCTYPE | Описание |
HTML 4.01 | |
Строгий синтаксис HTML | |
Переходный синтаксис HTML | |
В HTML-документе применяются фреймы | |
HTML 5 | |
XHTML 1.0 | |
Строгий синтаксис XHTML | |
Переходный синтаксис XHTML | |
XHTML-документе применяются фреймы | |
XHTML 1.1 | |
Пример использования doctype для HTML5 :
Содержимое странички
При выборе вида doctype следует иметь ввиду, что если вы пишите свой сайт в одном doctype, то не рекомендуется менять его в будущем на какой-то другой, так как скорей всего возникнут проблемы с правильным отображением сайта в различных браузерах, так как со сменой doctype вы поменяете правила обработки тегов браузерами.
Таким образом указав doctype вы указываете браузерам по каким правилам обрабатывать ваш html-код. Если же doctype не указать, то соответственно различные браузеры будут интерпретировать ваши теги по разному и следовательно отображение вашего сайта в некоторых браузерах скорей всего будет не корректным.
Какой doctype использовать?
Выбрать какой doctype использовать стало проще с выходом последней версии HTML5. Так как doctype html5 включает в себя правила предыдущих версий и возможность работы с тегами html4.
Вывод
Подведем итоги:
- DOCTYPE — это элемент, который указывает тип документа и определяет правила по, которым браузер будет обрабатывать ваш html-код;
- элемент doctype всегда должен быть размещен в первой строчке документа;
- всегда указывайте doctype, иначе ваши странички могут отображаться некорректно;
- если не знаете какой doctype использовать, указывайте doctype html5 : .
На этом все, желаю вам успехов! До новых встреч!
Вы дошли до третьей части этой главы. Здесь вы узнаете, как использовать селекторы дочерних элементов в CSS, а также познакомитесь с некоторыми дополнительными псевдоклассами для более точной выборки.
Дочерние селекторы CSS
В предыдущей статье мы рассказывали о родственных связях между элементами HTML-документа, в том числе и о дочерних элементах. Давайте посмотрим на примере, как эти связи можно использовать в CSS.
Представьте, что вам нужно присвоить стиль только тем тегам
Которые являются дочерними по отношению к
, не затрагивая остальные(например,
Дочерние по отношению к
Как это сделать? Очень просто: создадим дочерний селектор:
Body > p { color: #333; }
Обратите внимание на символ > после body . С помощью него вы указываете, что стиль применяется исключительно для дочерних тегов
Родителя
. Если символ убрать, то стиль применится абсолютно ко всем тегамКоторые находятся внутри тега
, хотя они могут и не являться для него дочерними.Дополнительные псевдоклассы
В CSS3 существует ряд псевдоклассов для работы с дочерними элементами. Ниже приведено описание каждого из них, примеры использования, а также отличия между псевдоклассами вида «child» и «of-type».
- :first-child – с помощью этого псевдокласса можно применить стиль к указанному элементу веб-страницы, при условии, что он является первым
- :last-child – стиль применяется к указанному элементу веб-страницы при условии, что он является последним дочерним элементом своего родителя;
- :nth-child – позволяет выбрать четные (even) и нечетные (odd) дочерние элементы; также с помощью данного псевдокласса можно стилизовать чередующиеся дочерние элементы, используя выражения вида an+b и числа;
- :only-child – применяется к дочернему элементу при условии, что тот является единственным ребенком у родителя;
- :first-of-type – стиль применяется к первому элементу указанного типа (даже если этот элемент не является первым дочерним для своего родителя и над ним находятся другие дочерние элементы других типов);
- :last-of-type – работает точно так же, как и предыдущий псевдокласс, с той лишь разницей, что стиль применяется к последнему элементу указанного типа ;
- :nth-of-type – по принципу работы похож на:nth-child , но ориентируется на тип элемента;
- :only-of-type – применяется к дочернему элементу указанного типа при условии, что тот является у родителя единственным ребенком своего типа .
Пример использования:first-child, :last-child и:nth-child
Первый ребенок
Второй ребенок
Третий ребенок
Нечетный номер |
Четный номер |
Нечетный номер |
Четный номер |
Последний ребенок
/* CSS */ p:first-child { font-weight: bold; text-transform: uppercase; } p:last-child { font-style: italic; font-size: 0.8em; } p:nth-child(3) { color: red; } tr:nth-child(odd) { background-color: #A2DED0; } tr:nth-child(even) { background-color: #C8F7C5; } Скриншот: применение:first-child, :last-child и:nth-child
Мы написали CSS стиль для дочерних элементов простого HTML-документа, где тег
,