Использование элемента DOCTYPE в режиме Quirks

Если вы разрабатывали веб-страницы более нескольких месяцев, вы, скорее всего, знаете о трудностях написания страницы, которая выглядит одинаково во всех браузерах. На самом деле это невозможно. Многие браузеры были написаны со специальными функциями, с которыми могли справиться только они. Или у них есть особые способы обработки вещей, которые отличаются от того, как их обрабатывают другие браузеры. Например:

  • Слои были созданы для использования в браузерах Netscape. Они не работают ни в каком другом браузере и фактически устарели в Netscape 6.x +.
  • Встроенные фреймы изначально создавались только для Internet Explorer и с тех пор стали частью спецификации HTML.
  • Internet Explorer 6.0 добавляет дополнительное пространство (например,
    ) окружающие теги, если только вы не напишите содержимое div в одной (длинной) строке. (IE 6 имеет много других причуд, а также этот.)
  • Netscpe 4.7 не будет отображать таблицы, которые не написаны в правильном HTML — вместо этого он показывает пустую страницу. Это было исправлено в Netscape 6.

Проблема для разработчиков браузеров заключается в том, что им приходится создавать веб-браузеры, обратно совместимые с веб-страницами, созданными для старых браузеров. Чтобы решить эту проблему, производители браузеров создали режимы для работы браузеров. Эти режимы определяются наличием или отсутствием элемента DOCTYPE и тем, что DOCTYPE звонки.

Переключение DOCTYPE и «Режим причуд»

Если вы поставите следующее DOCTYPE на вашей веб-странице:

Современные браузеры (Android 1+, Chrome 1+, IE 6+, iOS 1+, Firefox 1+, Netscape 6+, Opera 6+, Safari 1+) интерпретируют это следующим образом:

  1. Потому что там правильно написано DOCTYPE, это запускает режим стандартов.
  2. Это HTML 4.01 Переходный документ
  3. Поскольку он находится в стандартном режиме, большинство браузеров отображают контент, совместимый (или в основном совместимый) с HTML 4.01 Transitional.

И если вы положите это DOCTYPE в вашем документе:

Это говорит современным браузерам, что вы хотите отображать страницу HTML 4.01 в строгом соответствии с DTD. Эти браузеры перейдут в режим «строгого» или «стандартного» и отобразят страницу в соответствии со стандартами. (Таким образом, для этого документа такие теги могут быть полностью проигнорированы браузером, так как элемент FONT устарел в HTML 4.01 Strict.)

Если вы оставите DOCTYPE полностью отключив браузеры, вы переходите в режим «причуд».

В таблице ниже показано, что делают обычные браузеры, когда представлены разные общие DOCTYPE деклараций.

Microsoft делает это сложнее

Internet Explorer 6 также имеет функцию, которая, если вы ставите что-либо выше DOCTYPE декларация, они перейдут в режим причуд. Итак, оба эти примера переведут IE 6 в режим причуд, даже если DOCTYPE декларации говорят, что в режиме строгих стандартов:

и XHTML 1.1 DOCTYPE:

Плюс, если вы пройдете IE6, то у вас есть «функция», которую Microsoft добавила в IE8 и IE9: МЕТА переключение элементов и черный список сайтов. Фактически, эти две версии браузера теперь имеют до семи (!) Различных режимов:

  • IE 5,5 причудливый режим (IE 8 и 9)
  • Режим стандартов IE 7 (IE 8 и 9)
  • IE 8 почти стандартный режим (IE 8 и 9)
  • Режим стандартов IE 8 (IE 8 и 9)
  • IE 9 почти стандартный режим (IE 9)
  • Режим стандартов IE 9 (IE 9)
  • Режим XML (IE 9)

В IE 8 также введен «Режим совместимости», в котором пользователь может изменить модель рендеринга обратно в режим IE 7. Так что даже если вы установите режим, который вы хотите установить, используя оба DOCTYPE а также МЕТА элементы, ваша страница все еще может быть возвращена в менее совместимый со стандартами режим.

Что такое Quirks Mode?

Режим Quirks был создан, чтобы помочь справиться со всей странной поддержкой рендеринга и несовместимых браузеров и взломами, которые веб-дизайнеры использовали для решения этих задач. Беспокойство производителей браузеров заключалось в том, что если они переключат свои браузеры на полное соответствие спецификациям, веб-дизайнеры останутся позади. Путем настройки DOCTYPE Переключение и «Quirks Mode» позволили веб-дизайнерам выбирать, как они хотят, чтобы браузеры отображали их HTML.

Эффекты Quirks Mode

Есть несколько эффектов, которые большинство браузеров используют в режиме Quirks:

  • В некоторых браузерах блочная модель меняется на IE 5.5 версии блочной модели в режиме причуд.
  • Некоторые браузеры не наследуют стили в таблицах
  • Режим Quirks существенно влияет на синтаксический анализ CSS и макета CSS. Если вы конвертируете страницы в стандартный режим из режима Quirks, обязательно протестируйте свой макет CSS и тщательно проанализируйте его.
  • Следите за изменениями в сценариях, когда в режиме причуд. Firefox меняет способ Я бы атрибут работает, например. IE8 и IE9 очень сильно изменили сценарии в режиме причуд.

Есть также разница в режиме «Почти Стандарты»:

  • Высота ячеек таблицы только с изображениями рассчитывается иначе, чем в стандартном режиме.

Как выбрать DOCTYPE

Я вхожу в более подробно в моей статье DOCTYPE Список, но вот некоторые общие правила:

  1. Всегда сначала выбирайте режим стандартов. И текущий стандарт, который вы должны использовать, это HTML5: если у вас нет особых причин избегать использования HTML5 DOCTYPE, это то, что вы должны использовать.
  2. Перейдите к строгому HTML 4.01, если вам нужно проверить устаревшие элементы или по какой-то причине хотите избежать новых функций:
  3. Если вы нарезали изображения в таблице и не хотите их исправлять, перейдите к переходному HTML 4.01:
  4. Не пишите страницы намеренно в режиме причуд. Всегда используйте DOCTYPE. Это сэкономит вам время на разработку в будущем и действительно не принесет пользы. IE6 быстро теряет популярность, и, разрабатывая для этого браузера (что по сути и является дизайном в режиме «Причуды»), вы ограничиваете себя, своих читателей и свои страницы. Если вам нужно писать для IE 6 или 7, используйте условные комментарии для их поддержки, а не переводите современные браузеры в режим причуд.

Зачем использовать DOCTYPE

Как только вы узнаете об этом типе DOCTYPE переключение происходит, вы можете влиять на ваши веб-страницы более непосредственно с помощью DOCTYPE это указывает на то, что браузер может ожидать от вашей страницы. Кроме того, как только вы начнете использовать DOCTYPE, вы будете писать HTML, который будет ближе к действительности (вы все равно должны его проверить). И, написав действительный XHTML, вы поощряете производителей браузеров создавать совместимые со стандартами браузеры.

Версии браузера и режим причуд

DOCTYPE
Android
Хром
Fire Fox
IE 8+
IOS
Opera 7.5+
Сафари
IE 6
IE 7
Опера 7
Netscape 6
НиктоПричудливый режимПричудливый режимПричудливый режим
HTML 3.2
Причудливый режимПричудливый режимПричудливый режим
HTML 4.01
переходныйРежим стандартов *Режим стандартов *Режим стандартов
переходныйПричудливый режимПричудливый режимПричудливый режим
строгийРежим стандартовРежим стандартов *Режим стандартов
строгийРежим стандартовРежим стандартов *Режим стандартов
HTML5
Режим стандартовРежим стандартов *Причудливый режим

* С этим DOCTYPE браузеры близки к стандартам, но есть некоторые проблемы — обязательно протестируйте. Это также называется «Режим почти стандартов».

Ссылка на основную публикацию