Свойства CSS-специфики для поставщика: необходимое зло?

]

разработчики браузера (поставщики) часто расширяют спецификации CSS с собственными свойствами. Эти расширения служат различным целям, включая добавление новых функций, проведение экспериментов и облегчение тестирования функций, предназначенных для стандартизации W3C, прежде чем они достигнут статуса рекомендации кандидата.

]

, чтобы избежать конфликтов с существующими или будущими стандартными свойствами CSS, используется конкретная соглашение об именах. Свойства и ключевые слова, специфичные для поставщика, должны начинаться либо с гифена (-) или с подчеркиванием ( _ ). Рекомендуемый формат:

]

'-'   vendor specific identifier   '-'   meaningful name

'_'   vendor specific identifier   '-'   meaningful name

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

]

таблица 1: префиксы общего поставщика

] ] ] ] ] ] ] ] ] ] ] ] ] ] ] ] ] ] ] ] ] ] ] ] ] ] ] safari (и другие на основе Webkit) ] ] ] ] ]

prefix	организация
-РС-	microsoft
mso-	Microsoft Office
-moz-	Mozilla Foundation (на основе геккона)
-O-	Opera Software
-atsc-	Комитет по передовым телевизионным стандартам
-wap-	FORUM WAP
-webkit-	]
-khtml- Konqueror Browser	]

предупреждение:

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

Пример:

opacity Property ] перед широко распространенной поддержкой CSS3 разработчики использовали специфичные для поставщика расширения для

opacity

. Этот пример демонстрирует общий подход: ]

.тест { Фон: красный; / * Т.е. расширение фильтра */ Фильтр: Progid: dximagetransform.microsoft.alpha (непрозрачность = 60); Ширина: 100%; / * Требуется для фильтра IE */ -Моз-мобилизация: 0,6; / * Расширение Mozilla */ -Khtml-opbity: 0,6; / * Расширение Konqueror (Safari 1.1) */ непрозрачность: 0,6; / * Стандартный синтаксис CSS3 */ }

.test {
  background: red;
  /* IE filter extension */
  filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60);
  width: 100%;                /* Required for IE filter */
  -moz-opacity: 0.6;         /* Mozilla extension */
  -khtml-opacity: 0.6;        /* Konqueror extension (Safari 1.1) */
  opacity: 0.6;              /* Standard CSS3 syntax */
}

opacity

свойство, этот подход оставался функциональным. Обратите внимание, что интернет-исследователь Filter является нестандартным исключением. ]

Заключение:

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

]