Применение CSS. Часть 7, заключительная: Чего до сих пор нет в IE
Посмотрим, наконец, чего и в IE9 не появилось (хотя, возможно, появится в IE10) и что зачастую не реализовано и во всех остальных браузерах.
IE и уэбкиты не поддерживают значение text-decoration: blink. Ну и фиг с ним; дурацкая идея.
Только Firefox экспериментально реализовал в 6-й версии свойства оформления текста из CSS Text Level 3 - text-decoration-style, text-decoration-color и text-decoration-line. Они позволяют указывать стили подчёркивания (solid, double, dotted, dashed и wavy) - давно пора, а то позор же подчёркивать бордером! - и указывать подчёркиванию отдельный цвет. Свойство text-decoration-line фактически заменяет старое text-decoration-line за вычетом значения blink. Никто не реализует свойства text-decoration-skip (позволяющее избирательно не подчёркивать часть содержимого) и text-underline-position.
CSS3-модуль многоколоночной вёрстки полностью реализовала только Opera 11.1. Уже давно частичная поддержка есть в уэбкитах и ещё более ограниченная - в Firefox; обе реализации экспериментальные, поэтому используют свои префиксы. Однако, основные свойства - column-count, column-width, column-gap и column-rule - есть во всех этих браузерах. Так что, в принципе, добавить костыли через behavior для IE - и можно осторожно работать (если забить на Opera 10!). Но не факт, что они действительно нужны,- об этом есть ожесточённая дискуссия.
CSS3-спецификация Grid Layout пока не реализована нигде, но обещана в IE10. Подумывают о реализации Firefox и Webkit.
С CSS3-спецификацией Flexible Box Layout Module немного повеселее. У неё есть экспериментальная реализация в Firefox и Webkit. В Firefox нет свойства box-lines, но это неважно, поскольку в марте 2011 г. эта спецификация была коренным образом переписана, это и ряд других свойств из неё пропали, а остальные сменили имя.
Во всех браузерах, кроме IE, есть CSS3-псевдоклассы :default (в Firefox с 3-й версии), :valid, :invalid, :in-range, :out-of-range, :required и :optional (в Firefox с 4-й версии). Индикация правильных/неправильных значений элементов форм, может быть, не столь уж полезна: по хорошему, ввод следует маскировать. С другой стороны, такая индикация может сигнализировать, что ввод корректного значения ещё не завершён и в текущем виде оно ещё некорректно. Индикация required/optional в формах - обычное дело, но опираться на атрибут required применение этих псевдоклассов может только в HTML5, прежде его не было. А атрибут readonly был, но псевдоклассы для него - :read-only, :read-write - ещё имеют экспериментальную реализацию в Firefox и неправильно работают в Opera.
CSS3-свойство text-shadow - полезнейшая вещь, даже не в чисто декоративном смысле. Когда нужно добиться читаемости текста на неоднородном фоне - можно бросить вокруг него текст контрастным цветом (для той же цели могло бы послужить свойство text-outline, но вот оно-то не реализовано, кроме экспериментального подобия в Webkit). Кроме IE понимается везде. По Интернету ходят легенды о -moz-text-shadow и -o-tex-shadow, но это неправда: не было таких свойств, а значит получить тень текста в Firefox до версии 3.5 и Opera до версии 9.5 невозможно. В IE можно воспользоваться фильтром вида filter: Shadow(Color=#цвет, Direction=угол, Strength=длина);.
CSS3-свойство outline-offset есть везде, кроме IE.
CSS3-свойство border-image реализовано только в Opera 10.5, а в Firefox и Webkit имеет экспериментальные и неполные реализации. В принципе, если забить на IE (забиваю же я в том, что касается уголков), можно применять. Кстати, Firefox (пока единственный) с незапамятных времён позволяет указывать множество цветов для рамки, в соответствии с CSS3.
Свойство box-decoration-break реализовано только в Opera 11.0.
CSS2-свойство font-size-adjust реализовано только в Firefox (с версии 3.0, а для Windows - с версии 1.0). Оно позволяет менять размер шрифта на основе его ex (фактический размер будет равен выведенному из установленного размера ex, поделенному на значение этого свойства).
Нигде не реализованы CSS3-свойства text-wrap, punctuation-trim, text-emphasis, hanging-punctuation, text-combine, icon, единицы dppx, gd и fr.
CSS3-свойство resize, включающее (или отключающее) возможность изменения размеров элемента пользователем, реализовано в Webkit и с 4-й версии Firefox.
CSS3-свойство appearance, вообще говоря, сомнительное, реализовано в Webkit и ещё с 1-й версии Firefox.
CSS3-свойства для управления порядком навигации по странице nav-index, nav-up, nav-right, nav-down, nav-left реализованы только в Opera ещё версии 9.5.
Из модуля CSS3 Module: Paged Media только в Opera реализованы свойства size (ещё с версии 7.0), object-fit и object-position (с версии 11.0). Свойства page и image-orientation не реализованы нигде.
Из модуля CSS3 Speech Module только в Opera реализованы свойства cue, cue-after, cue-before, pause, pause-after, pause-before, speak, voice-family (ещё с версии 7.0), да в экспериментальном порядке - voice-balance, voice-duration, voice-pitch, voice-pitch-range, voice-rate, voice-stress, voice-volume, interpret-as, phonemes. Остальные свойства не реализованы нигде и никак (rest, rest-after, rest-before, mark, mark-after, mark-before).
CSS3-модуль CSS 3D Transforms Module Level 3 имеет только экспериментальную реализацию в Webkit.
CSS3-модуль анимации CSS Animations Module Level 3 реализован в Firefox 5.0 и Webkit (с 2008 г.) - в полном объёме, но в экспериментальном порядке. CSS3-модуль CSS Transitions Module Level 3 (см. также «CSS3 сейчас - transition») тоже экспериментально реализован ещё шире - в Firefox 4.0, Opera 10.5 и Webkit (тоже с 2008 г.). Впрочем, тут более чем уместны Javascript-реализации, потому как обычно анимация и реализуется посредством Javascript. Так почему бы не писать CSS3-анимацию для всех браузеров, а кто её не понимает, будет просто принимать её как дескриптивную программу для Javascript-интерпретатора? Навскидку я, правда, такового не нашёл.
CSS3-модуль CSS Marquee Module Level 3 имеет только (с 2008 г.) экспериментальную реализацию в Webkit (кроме свойства overflow-style).
Единицы измерения частоты Hz и kHz реализованы в Webkit.
Типы картинок и нигде не реализованы (и уже исключён из CSS Image Values Module Level 3). Зато типы и , и имеют экспериментальную поддержку в Firefox 3.6, Opera 11.10, Chrome 10.0 (и вот-вот получат в Safari), IE 10.0. В IE5.5-8 можно пользоваться фильтром. IE9, за исключением линейного градиента, парадоксальным образом пролетает.
Значение initial (в дополнение к имевшимся в CSS2 auto и inherit) имеет поддержку в Webkit и в Firefox (в последнем - экспериментальная, вводилась постепенно в версиях 1.0-3.6).
Единицы dpi и dpcm для @media-правил разрешения реализованы в Firefox 3.5 и Opera 10.5.