Вендорные префиксы — что это и зачем нужно?

Всем привет. Сегодня я вам расскажу, что такое вендорные префиксы, нужно ли их использовать и для чего они вообще нужны при создании интернет-ресурса.

Что такое вендорные префиксы?

Можно сказать, что это такие приставки к css-свойствам, которые позволяют этим самым свойствам работать в более старых версиях браузеров. Наверняка вы знаете, что технологии css развивается и в ней появляются новые возможности. Браузеры не успеют их поддерживать. Кстати, как проверить сайт на кроссбраузерность я писал здесь.
кроссбраузерность
Таким образом, старые версии веб-обозревателей не могут интерпретировать их, а веб-разработчик старается угодить всем. Вот и используются вендорные префиксы, чтобы и старые версии браузеров начали поддерживать свойство.

Какие они бывают

  1. -webkit — для Google Chrome, Yandex Browser, Safari и iOs;
  2. -moz — для Mozilla;
  3. -o — для Оперы;
  4. -ms — для Internet Explorer;

Собственно, все, это все вендорные префиксы, о которых нужно знать.

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

Тут все предельно просто на самом деле. Пишем сначала сам префикс, а потом через дефис само свойство. Например:
-moz-linear-gradient — теперь линейный градиент будет поддерживаться в старых версиях Firefox. А именно, с 6-й по 15-ю версии.
-ms-border-radius — некоторые старые версии IE будут поддерживать свойство. Очень старые не поддерживают его даже с префиксом.

Стоит ли использовать?

Поскольку все еще появляются новые свойства, префиксы придется использовать во многих ситуациях. Но все же многие новые свойства сегодня настолько хорошо поддерживаются в новых браузерах, что для них практически отпала необходимость в префиксах. Это касается, например, border-radius.

Свойства, для которых иногда все еще применяют префиксы:

  1. тени (box-shadow)
  2. градиенты
  3. background-size
  4. трансформации (transform)
  5. фильтры (filter)

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

С другой стороны, есть веб-разработчики перфекционисты, которые хотят, чтобы их творения хорошо работали везде, вот они и используют эти приставки. В общем, если вы работаете с CSS3, то вам полезно будет знать о существовании таких приставок.

Для облегчения написания кода с префиксами сегодня советуют использовать постпроцессор AutoPrefixer, но лично я им не пользовался. Ну а что вы думаете о будущем вендорных префиксов?

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

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: