他們是什麼以及為什麼你應該使用它們
CSS供應商前綴（也稱為CSS瀏覽器前綴）是瀏覽器製造商在所有瀏覽器完全支持這些功能之前添加對新CSS功能的支持的一種方式。 這可能會在測試和實驗期間完成，瀏覽器製造商正在確定如何實現這些新的CSS功能。 這些前綴在幾年前隨著CSS3的興起而變得非常流行。
當CCS3首次推出時，許多激動人心的特性開始在不同的時間點擊不同的瀏覽器。 例如，webkit驅動的瀏覽器（Safari和Chrome）是第一批引入一些動畫風格的屬性，如變換和轉換。 通過使用供應商的前綴屬性，網頁設計人員可以在他們的工作中使用這些新功能，並讓他們立即在支持它們的瀏覽器上看到，而不必等待其他瀏覽器製造商趕上！
因此，從前端Web開發人員的角度來看，瀏覽器前綴用於在網站上添加新的CSS功能，同時知道瀏覽器將支持這些樣式。 當不同的瀏覽器製造商以不同的方式或使用不同的語法來實現屬性時，這可能特別有用。
您可以使用的CSS瀏覽器前綴（每個都針對不同的瀏覽器）是：
- Android：-webkit-
- Chrome：-webkit-
- Firefox：-moz-
- Internet Explorer：-ms-
- iOS：-webkit-
- 歌劇：-o-
- Safari：-webkit-
在大多數情況下，要使用全新的CSS樣式屬性，需要使用標準CSS屬性並為每個瀏覽器添加前綴。 前綴的版本總是會優先（以您喜歡的任何順序排列），而普通的CSS屬性會持續到最後。 例如，如果您想向文檔添加CSS3轉換，則可以使用transition屬性，如下所示：
-webkit-轉換：所有4s緩解;
-moz-過渡：所有4s緩解;
-ms-過渡：所有4s緩解;
-o-過渡：所有4s緩解;
過渡：所有4s緩解;
注意：請記住，某些瀏覽器對某些屬性的語法與其他瀏覽器的語法不同，因此不要認為瀏覽器前綴的屬性版本與標準屬性完全相同。 例如，要創建CSS漸變 ，請使用線性漸變屬性。 Firefox，Opera以及Chrome和Safari的現代版本都使用該屬性並使用適當的前綴，而早期版本的Chrome和Safari使用前綴屬性-webkit-gradient。 另外，Firefox使用與標準值不同的值。
你總是以CSS屬性的正常，非前綴版本結束聲明的原因是，當瀏覽器支持該規則時，它將使用該規則。 記住CSS是如何讀取的。 如果特異性相同，則後面的規則優先於先前的規則，因此瀏覽器將讀取規則的供應商版本，並在不支持正常規則的情況下使用該版本，但一旦這樣做，它將覆蓋供應商版本實際的CSS規則。
供應商前綴不是黑客
當第一次推出供應商前綴時，許多網絡專業人員想知道他們是黑客還是轉移到黑暗的時代去分支一個網站的代碼來支持不同的瀏覽器（記住那些“ 這個網站最好在IE中查看 ”的消息）。 然而，CSS供應商的前綴並不是黑客，你應該對你在工作中使用它們沒有任何保留。
CSS hack利用另一個元素或屬性的缺陷實現另一個屬性的正常工作。 例如，box模型hack利用了語音族屬性解析中的缺陷或瀏覽器解析反斜杠（\）的方式。 但是這些黑客被用來解決Internet Explorer 5.5處理盒子模型和Netscape如何解釋它之間的區別問題，並且與聲音家庭風格無關。 值得慶幸的是，這兩種過時的瀏覽器是我們近期無需擔憂的瀏覽器。
供應商前綴不是黑客，因為它允許規範設置如何實現屬性的規則，同時允許瀏覽器製造商以不同的方式實現一個屬性而不會破壞其他所有內容。 此外，這些前綴與CSS屬性一起工作， 最終將成為規範的一部分 。 我們只是簡單地添加一些代碼，以便儘早訪問該屬性。 這是您使用普通的非前綴屬性結束CSS規則的另一個原因。 這樣，一旦完全支持瀏覽器，您就可以放棄前綴版本。
想知道瀏覽器支持哪些功能？ CanIUse.com網站是收集這些信息的絕佳資源，並讓您了解哪些瀏覽器以及這些瀏覽器的哪些版本目前支持某項功能。
供應商前綴煩人但臨時
是的，它可能會感到討厭和重複，必須編寫2-5次的屬性才能使其在所有瀏覽器中都能正常工作，但這只是暫時的情況。 例如，就在幾年前，為了在一個盒子上設置一個圓角，你必須寫下：
-moz-border-radius：10px 5px;
-webkit-border-top-left-radius：10px;
-webkit-border-right-right-radius：5px;
-webkit-border-bottom-right-radius：10px;
-webkit-border-bottom-left-radius：5px;
border-radius：10px 5px;
但是現在瀏覽器已經完全支持這個功能，你真的只需要標準化版本：
border-radius：10px 5px;
Chrome從5.0版開始支持CSS3屬性，Firefox在4.0版中增加了它，Safari在5.0中增加了它，Opera在10.5中，iOS在4.0中，Android在2.1中。 即使Internet Explorer 9也不支持前綴（IE 8和更低版本不支持前綴或前綴）。
請記住，瀏覽器總是會發生變化，除非您打算構建比現代方法晚數年的網頁 ，否則將需要支持舊版瀏覽器的創意方法。 最後，編寫瀏覽器前綴比找到並利用最有可能在未來版本中修復的錯誤要容易得多，這要求您找到另一個可以利用的錯誤等等。