Использование префиксов браузера после имен свойств

Question

Ну, это странный вопрос. В любом случае, что произойдет, если я использую префиксы браузера после имени свойства css вместо того, чтобы ставить его раньше? Пример:

box-shadow: 0 2px 2px rgb(0, 0, 0), 0 1px rgba(255, 255, 255, 0.0) inset; 
box-shadow -moz-: 0 2px 2px rgb(0, 0, 0), 0 1px rgba(255, 255, 255, 0.0) inset; 
box-shadow -webkit-: 0 2px 2px rgb(0, 0, 0), 0 1px rgba(255, 255, 255, 0.0) inset; 

Это не только любопытство вопроса, мой друг сказал, что он писал эти строки УСС и что они работают. Я ответил ему, что Chrome и Firefox правильно управляют такими ошибками, что заставляет их работать, но теперь мне немного любопытно. Правильно ли я считаю, что этот способ использования префиксов (а не Suffixed на самом деле) не является стандартным и его следует избегать, хотя они, похоже, работают?

Answer 1

Это не должно быть стандартом. Я бы не стал использовать это. Единственная причина, по которой я могу думать о том, как это будет работать, - это то, как они анализируют ее. Так же, как вы можете смешать значения атрибута стиля фона. (Как вы можете сделать background: url("pathtoimage") #FFF хотя должен бытьbackground: #FFF url("pathtoimage").)

Answer 2

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

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

Answer 3

Браузер игнорирует второй и третий правила, поскольку они являются недействительными. Он «работает», потому что все современные браузеры теперь поддерживают box-shadow без префикса и поэтому используют первое правило.

В Chrome вы можете увидеть это, просмотрев стили в devtools; неверные правила отсутствуют, потому что они были выброшены.

Firefox выдает следующие ошибки во вкладке «CSS»:

Expected ':' but found '-moz-'. Declaration dropped. box-shadow.html:4:16 
Expected ':' but found '-webkit-'. Declaration dropped. box-shadow.html:5:1 

Понятие размещения префикс поставщика после имени свойства не определено в любом стандартна и не поддерживается ни одним браузером. Это недействительно чисто и просто.

Другими словами, вы можете удалить неверные второе и третье правила, и все будет работать точно так же.