Что такое браузерные префиксы и когда они используются?

Что такое браузерные префиксы?

Браузерные префиксы (vendor prefixes) — это специальные приставки к CSS-свойствам, которые указывают, что данное свойство является экспериментальной реализацией конкретного браузера. Они позволяют разработчикам использовать новые возможности CSS до того, как они будут полностью стандартизированы и включены в спецификацию W3C.

Основные префиксы

• -webkit- — для браузеров на движке WebKit (Chrome, Safari, Opera, Edge)
• -moz- — для Firefox
• -ms- — для Internet Explorer и старых версий Edge
• -o- — для Opera (устарел)

Когда используются префиксы?

Префиксы применяются, когда CSS-свойство находится на стадии черновика или кандидата в рекомендации. Например, свойство transform долгое время требовало префиксов:

.element {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

Современная практика

Сегодня многие свойства уже стандартизированы, и префиксы не нужны. Однако для новых возможностей (например, backdrop-filter) префиксы всё ещё актуальны. Рекомендуется использовать автопрефиксеры (например, Autoprefixer в сборщиках Webpack или PostCSS), которые автоматически добавляют нужные префиксы на основе данных Can I Use.

Вывод

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