相信有在寫CSS的朋友一定都看過-webkit-、-moz-、-o-等，明明一個語法為什麼要再重複貼上三行並加上這些字首，如果不加好像也不會怎樣？它們有什麼差別，以下將說明三者的差異。
前綴
這些字首一般稱為「前綴（Prefix）」，是瀏覽器供應商為了實驗性質而制定的，在新屬性出現時，作為實驗性開發而使用的前綴字，這樣可以防止在實驗過程中破壞標準語法，待實驗沒問題後，通常會移除轉而使用標準語法。
簡單來說，就是各家瀏覽器不一定都支援CSS3新屬性，因此當某些CSS在其他瀏覽器上失效，可能就是少了前綴字，建議設計CSS時可以參考瀏覽器兼容資訊，以下列出常見的前綴。
-webkit- /* Chrome、Safari */
-moz- /* Firefox */
-o- /* Opera */
-ms- /* Internet Explorer */
詳細說明
-webkit-
用於 Chrome、Safari、較新版本的 Opera 、 Edge，以及幾乎所有 iOS 的瀏覽器，包括 Firefox for iOS；基本上，泛指任何基於 WebKit 或 Chromium 的瀏覽器。
-moz-
用於 Firefox 火狐瀏覽器。
-o-
指舊的 WebKit 之前的 Opera 版本瀏覽器。
-ms-
用於 Chromium 之前的 Internet Explorer 和 Microsoft Edge 瀏覽器。
實際操作
See the Pen Untitled by kumo (@kumo-tw) on CodePen.
CSS兼容查詢：https://caniuse.com