Влияет ли HTML5 DOCTYPE на отображение эффектов CSS3?

Есть ли разница в том, как визуализируются эффекты css3 (например, анимация), если тип документа определяется как

<!DOCTYPE html> (HTML5)

или, скажем так, обычное

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Как разные типы документов влияют на рендеринг css (кроме запуска режима quirks, который, как известно, рендерится по-разному)?

Образцы оценены.


person easwee    schedule 28.07.2011    source источник


Ответы (4)


С точки зрения рендеринга CSS между этими двумя типами документов почти нет * разницы.

Выбор типа документа влияет только на проверку, а также на то, какой «режим браузера» используется вне «Quirks Mode», «Стандартный режим» («режим без причуд»), «Почти стандартный режим» («режим с ограниченными причудами»).

См. http://hsivonen.iki.fi/doctype/.

Итак, XHTML 1.0 Transitional дает "почти стандартный режим", тогда как <!DOCTYPE html> дает "стандартный режим".

* Одно отличие - это незначительное и легко исправляемое изменение, касающееся tables. Другой - обработка элементов заголовка, вложенных в определенные элементы HTML5.

person thirtydot    schedule 28.07.2011
comment
Страница Анри Сивонена была отличным чтением - спасибо за ссылку - парень действительно углубился в свою работу. - person easwee; 29.07.2011

Я думаю, что HTML5 сам по себе подразумевает улучшение читабельности CSS, и ничего больше.

person Rauzippy    schedule 28.07.2011
comment
хотите расширить это немного больше? Как именно улучшается читаемость? Синтаксис такой же. - person easwee; 29.07.2011

Тип документа не должен влиять на это, но существуют библиотеки, которые помогут вам определить, какие функции доступны вам в конкретном клиенте, например Modernizr < / а>.

person johnmdonahue    schedule 28.07.2011

Да, это так, и я могу сказать вам это по собственному опыту.

HTML-страницы, которые состоят из нарезанных таблиц, без заполнения ячеек и пробелов между ячейками, не работают с типом документа HTML5. Пришлось использовать переходный HTML4.

HTML-страницы, использующие системы макета сетки, могут иногда лучше работать с типом документа HTML5. Я обнаружил, что Tiny Fluid Grid не работает с переходным типом документа HTML4.

person desbest    schedule 28.07.2011
comment
В любом случае использование таблиц для макета - это плохая практика и неправильное использование элемента <table>. Я не могу много сказать о плавных макетах - придется это проверить. - person easwee; 29.07.2011
comment
@easwee: Я только что попробовал Tiny Fluid Grid в обычных браузерах с несколькими разными типами документов (включая HTML4 Transitional), и у меня это всегда срабатывало. Таблица может быть такой: developer.mozilla.org/en/Images,_Tables,_and_Mysterious_Gaps - person thirtydot; 29.07.2011
comment
Хорошо, что у тебя работает. О реальном примере, о котором я рассказывал, он здесь. littersky.com С переходным типом документа HTML4 макет не работает. - person desbest; 29.07.2011
comment
@desbest - страница даже не проходит валидацию html5 - неудивительно, что она не проходит. - person easwee; 29.07.2011
comment
Страница не проходит проверку, потому что она использует плагин Shadowbox lightbox, который требует rel="shadowbox[gal1], и что иногда созданные атрибуты тега html используются для целей ajax. Если бы я убрал все это, страницы прошли бы проверку HTML5. Я проверил все свои страницы, и там есть только такие привередливые и строгие ошибки. Каждое изображение на этом сайте имеет атрибут alt=, и все самозакрывающиеся теги заканчиваются на `/› `, как говорит валидатор. - person desbest; 29.07.2011
comment
Тридцать точек? Это странно. Это не сработало, когда я разрабатывал сайт в 2010 году, тестировал его в IE8, FF3 / 4 и Opera 10. Возможно, браузеры реализовали спецификацию HTML5 того, как они обрабатывают ошибки, или что-то в этом роде. Я все равно буду переделывать сайт позже. - person desbest; 29.07.2011