CSS供應商前綴

CSS供應商前綴，自動前綴的概述以及為什麼它們之間的相關性不高

供應商前綴是瀏覽器用來為我們的CSS開發人員提供訪問尚未被認為穩定的新功能的一種方式。

在繼續操作之前，請記住，這種方法的受歡迎程度正在下降，而贊成使用實驗性標誌，必須在用戶的瀏覽器中顯式啟用它。

為什麼？因為開發人員沒有考慮供應商前綴作為預覽功能的方法，而是在生產中交付了它們-CSS工作組認為這是有害的。

通常是因為一旦添加了標記並且開發人員開始在生產中使用它，瀏覽器如果意識到必須進行某些更改，就會處於不利地位。使用標記，除非您可以推動所有訪問者在其瀏覽器中啟用該標記，否則就無法發布功能（只是在開玩笑，請勿嘗試）。

也就是說，讓我們看看供應商前綴是什麼。

我特別記得他們過去使用CSS Transitions的情況。而不只是使用transition屬性，您必須執行以下操作：

.myClass {
	-webkit-transition: all 1s linear;
	-moz-transition: all 1s linear;
	-ms-transition: all 1s linear;
	-o-transition: all 1s linear;
	transition: all 1s linear;
}

現在，您只需使用

.myClass {
	transition: all 1s linear;
}

因為現在所有現代瀏覽器都很好地支持該屬性。

使用的前綴是：

-webkit-（Chrome，Safari，iOS Safari / iOS WebView，Android）
-moz-（Firefox）
-ms-（Edge，Internet Explorer）
-o-（歌劇，Opera Mini）

由於Opera和Edge是基於鉻的，-o-和-ms-可能很快就會過時。但是正如我們所說，供應商前綴從整體上也已經過時了。

寫前綴很困難，主要是因為不確定性。您實際上是否需要為一個屬性添加前綴？一些在線資源也已經過時，這使得正確做事變得更加困難。像這樣的項目自動前綴可以使整個過程自動化，而無需我們查找是否需要前綴，或者該功能現在穩定並且應該刪除該前綴。它使用來自caniuse.com的數據，該網站是有關瀏覽器支持的所有方面的很好的參考網站。

如果您使用React或Vue，則類似create-react-app和Vue CLI，這是開始構建應用程序的兩種常用方法，autoprefixer開箱即用，因此您甚至不必擔心。

免費下載我的CSS手冊

CSS供應商前綴

CSS供應商前綴，自動前綴的概述以及為什麼它們之間的相關性不高

更多CSS教程：