Время для прочтения: 2 мин. 9 сек.

Вендорные префиксы

Вендорные префиксы - своего рода приставки для CSS свойств, используемые производителями браузеров для экспериментальных CSS свойств, не принятых W3C. Например, -o-border-radius, -moz-opacity или -ms-filter.

Согласно спецификации CSS 2.1 CSS идентификаторы, которые начинаются с - или _ зарезервированы для CSS расширений браузеров. Наличие этих знаков в начале свойства гарантирует то, что в будущем расширения браузеров никогда не пересекутся со стандартными CSS свойствами. Т.е. ни один браузер не начнет «случайно» понимать свойство, которое для него не предназначено.

ПрефиксВендорДвижокБраузер
-moz-MozillaGeckoMozilla, Firefox, SeaMonkey, Camino
-webkit-AppleWebKitGoogle Chrome, Safari > 3
-khtml-KDEKHTMLKonqueror, Safari < 3
-o-, -op-, -xv-Opera SoftwarePrestoOpera
-ms-, mso-MicrosoftTridentInternet Explorer 8
-icab-iCab CompanyiCab
-atsc-Advanced Television Standards Committee
-wap-The WAP Forum
prince-YesLogic
-ah-Antenna House
-hp-Hewlett Packard
-ro-Real Objects
-rim-Research In Motion
-tc-TallComponents

Причины появления вендорных префиксов

  • CSS cвойство разработано только для конкретного браузера и не описано в спецификации
  • CSS модуль находится в разработке W3C и не достиг статуса Candidate Recommendation
  • CSS cвойство только частично реализует функции свойства, описанного в CSS модуле или спецификации

Как использовать?

Использовать проще некуда. Достаточно перечислить их все, а в конце поставить утвержденное W3C CSS свойство (если оно, конечно, имеется)


.rounded {
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    -o-border-radius: 5px;
    -ms-border-radius: 5px;
    -icab-border-radius: 5px;
     border-radius: 5px;
}

Свойства с вендорными префиксами не соответствуют стандартам и не проходят валидацию

Ссылки

Статья не завершена. Материал постоянно пополняется.

Пошерить
Плюсануть
Отправить
Вотсапнуть

Добавить комментарий

Такой e-mail уже зарегистрирован. Воспользуйтесь формой входа или введите другой.

Вы ввели некорректные логин или пароль

Извините, для комментирования необходимо войти.

1. Нажимая на кнопку "Отправить", я даю согласие на обработку персональных данных.

2. Для вставки кода используйте специальные теги [code lang="php"]ваш код[/code]

2 комментария

сначала новые
по рейтингу сначала новые по хронологии
Виталий

Онлайн инструмент для добавления актуальных венозных префиксов, может пригодится кому-нибудь – http://autoprefixer.github.io

Спасибо, добавил в статью ссылку