Прочитав комментарии к посту Firefox 3: * {display: block } ошибка , я понял, что значительная часть читателей Хабра, в том числе серьезно занимающихся веб-разработкой, не совсем правильно представляют себе что-то вроде HTML, и почему теги отображаются именно так, а не иначе.
Как всегда, начнем с истории.
Обо всём этом уже написано тысячи раз, но всё же.
HTML ведет свою «родословную» от языка с вековой историей, разработанного IBM в конце 60-х годов.
ГМЛ , предназначенный для универсальной системы обмена документами.
В середине 80-х его преемник прошел стандартизацию ISO и получил название SGML, и, наконец, в начале 90-х Бернерс-Ли разработал на его основе HTML. А могло ли быть так: мухи отдельно, котлеты отдельно? Может. И даже необходимо.
Именно так решили специалисты IBM, разработавшие GML, и отделили смысловое значение элементов документа (логическую структуру) от их внешнего вида (представления).
Логика документа (смысл его составных частей) является неотъемлемой частью самого документа, и управлять внешним видом было решено через внешние файлы стилей.
Правила составления документа (перечень тегов и правила их использования) также были перенесены во внешние файлы — ОТД .
В результате мы получаем систему из трех компонентов:
- ОТД — Определение правил использования элементов разметки.
Документация — Данные размечены в соответствии с правилами DTD. Файлы стилей — Определение внешнего вида элементов разметки Версии HTML 1 и 2 включали в свою схему только первые два пункта и не предлагали авторам документов возможности подключать внешние файлы стилей, оставляя внешний вид документа на усмотрение браузера.
Спецификация HTML 2.0 Я лишь дал рекомендации по отображению отдельных элементов документа.
Лут побеждает. С бурным развитием интернет-торговли в середине 90-х годов инструменты HTML 2.0 стали дефицитными.
И предприимчивая Netscape, тогдашний лидер на рынке браузеров, а вслед за ней и Mircosoft, тоже желавшая отхватить кусок пирога, начали внедрять в свои браузеры различные «расширения» языка HTML. По сути, превращая его из языка разметки в язык дизайна.
Некоторые нововведения отражены в HTML 3.2 в виде атрибутов, таких как фон, цвет и тегов, таких как шрифт. CSS в помощь 1 В 1996 году W3C утвердил спецификацию CSS — таблиц стилей — призванную положить конец беспорядку и вернуть HTML его первоначальное назначение — определять значение элементов документа, а не их внешний вид. Те.
дайте HTML тот же третий компонент, что и GML. Однако ничто не проходит бесследно.
Эпоха браузерных войн и HTML 3.2 оставила серьёзный след как в браузерных движках, вынужденных поддерживать HTML-расширения, так и в умах веб-мастеров, привыкших смешивать логику и представление воедино.
Как браузеры определяют внешний вид элементов?
Основными «инструкциями» по парсингу HTML-документа для браузера являются: ОТД , который содержит список тегов, атрибутов, правила их размещения и другие правила форматирования документа.Например, определение тега стиль говорит, что тег может содержать такие данные, как CDATA для него разрешены атрибуты интернационализации (lang, dir), а также атрибуты type, media и title. Теги п И час описываются одинаково, за исключением того, что hr не может иметь содержимого, а p может содержать строковые данные.
Обратите внимание, что в DTD нет указания, что hr следует отображать горизонтальной линией, а p следует добавлять с вертикальным дополнением! Откуда же браузер знает, что п должны быть углубления и сильный - Должно ли это быть напечатано жирным шрифтом? Ну и что вообще отвечает за нашу внешность? Да, третий компонент модели GML — это стили.
В случае HTML это CSS. Если вы откроете URI в FireFox: ресурс://gre/res/html.css , то вы сможете увидеть те самые стили, которые по умолчанию применяются к HTML-документам.
Вот стиль абзаца:
p, dl, multicol { display: block; margin: 1em 0; }
Но для горизонтальной линии:hr { display: block; height: 2px; border: 1px inset; margin: 0.5em auto 0.5em auto; color: gray; -moz-float-edge: margin-box; -moz-box-sizing: border-box; } hr[size="1"] { border-style: solid none none none; }
Не правда ли, все просто и логично? Вернемся к поведению, описанному в Firefox 3: * {display: block } ошибка , и посмотрим, каким правилам следует FireFox при отображении основных блоков документа:html, div, map, dt, isindex, form { display: block; } body { display: block; margin: 8px; } .
Что мы имеем в итоге? И в итоге имеем следующую последовательность правил:/* hidden elements */ area, base, basefont, head, meta, script, style, title, noembed, param { display: none; }
area, base, basefont, head, meta, script, style, title, noembed, param { display: none; } .
Согласно правилам каскадирования, определенным CSS 2.1, правила автора имеют приоритет над правилами пользовательского агента, соответственно, второй стиль переопределяет первый и все элементы документа.* { display: block; }
включая теги заголовка и стиля становятся блочными, и содержимое тега стиля, имеющего тип CDATA (см.
выше), выводится в браузер.
Судя по всему, Opera, Safari и Konqueror делают то же самое.
Впереди планеты всей.
.
как всегда Internet Explorer. Трудно сказать, как браузер Microsoft обрабатывает документы, но, судя по ряду признаков, он основан не на DTD и стилях, а на каких-то собственных представлениях о HTML. Очевидно, наследие HTML 3.2 берет свое.
Заключение
Помимо стандартов «де-юре», в сети, как и в других сферах, существует множество стандартов «де-факто», имеющих исторические корни.Подобные стандарты многими воспринимаются как данность, развивая определенную инерцию мышления.
Столкнувшись с чем-то естественным, предсказуемым, но нарушающим привычный порядок, обладатели такой инерции удивляются и объявляют необычное ошибкой.
Но хотелось бы напомнить пословицу: доверяй, но проверяй! А бывает, что при проверке ошибка оказывается вовсе не ошибкой, а следствием незнания, непонимания или той самой инерции мышления.
Ссылки
- HTML 2.0 – http://www.faqs.org/rfcs/rfc1866.html
- HTML 3.2 – http://www.w3.org/TR/REC-html32-19970114
- DTD HTML 4.01 Строгий — http://www.w3.org/TR/html401/sgml/dtd.html
- Артемий Ломов.
«HTML, CSS, скрипты: практика создания сайтов»
- «Рик Мейер.
«CSS — Каскадные таблицы стилей»
1 Название главы в книге Рика Мейера «CSS — Каскадные таблицы стилей»
-
Дамаск
19 Oct, 24 -
Как Поймать Вирус В Запароленном Архиве
19 Oct, 24 -
Видеообзор Клиента Evernote Для Android
19 Oct, 24 -
Как Обойтись Без Автоматизации Ms Office
19 Oct, 24 -
Очиститель Мыслей
19 Oct, 24