CSSのベンダープレフィックス【現役エンジニアが解説】
今回は、CSSのベンダープレフィックスについて、3種類に分け、簡単に解説していきます。
-ms-
-ms-はInternet Explorer用のベンダープレフィックスです。
なお、Edgeは現在、Chromeとほぼ同様のため、-ms-は使えません。
.hoge{ -ms-transform:rotate(45deg); }
上記のコードでは、Internet Explorer用のtransformプロパティを指定しています。
-moz-
-moz-というベンダープレフィックスはFirefox用となります。
-moz-はFirefox独自のベンダープレフィックスで、他のブラウザでは使えません。
.hoge{ -moz-transform:rotate(45deg); }
上記のコードでは、Firefox用にtransformプロパティにベンダープレフィックスを付けています。
-webkit-
ChromeやSafari用のベンダープレフィックスとして-webkit-が使えます。
-webkit-はChromeやSafari以外に、現在ではEdgeにも使うことができるようになっています。
.hoge{ -webkit-transform:rotate(45deg); }
上記のコードでは、-webkit-のベンダープレフィックスを使い、ChromeやSafari用のtransformプロパティを書いています。