CSSでよく目にする-moz-や-webkit-は、なんのために付けているのだろう?
と思い調べたため、共有したいと思います。
ベンダープレフィックスとは
ベンダープレフィックスとは、例えば『-webkit-background-clip』のように-moz-や-webkit-などをプロパティの先頭につけることで、
FirefoxやGoogle Chromeなどの各ブラウザで、プロパティを機能させるようにすることです。
主要なベンダープレフィックスのブラウザは以下になります。
| -moz- | Firefox |
| -webkit- | Google Chrome、Safari |
| -o- | Opera |
| -ms- | Internet Explorer |
ベンダープレフィックスの使用例
ベンダープレフィクスを記載する際は、以下の使用例のように
ベンダープレフィクス無しの指定も併記しましょう!
.box {
background-clip: padding-box;
-webkit-background-clip: padding-box;
-moz-background-clip: padding-box;
}
また、どのプロパティにベンダープレフィックスを付ければいいのかわからない!
という方は、以下のサイトが役に立ちますのでぜひ!
まとめ
今回は、簡単にベンダープレフィックスについて解説していきました。
ここでもう一度まとめると、ベンダープレフィックスとは、
FirefoxやGoogle Chromeなどの各ブラウザで、プロパティを機能させるようにするために使う!です。
それでは、最後まで読んでいただきありがとうございました。
タグ