CSSにおけるベンダープレフィックスとは
ベンダープレフィックスとは、ブラウザごとにつける接頭辞のことを言います。W3CのCSS勧告において草案段階の仕様をブラウザが先行して実装した場合に、ベンダープレフィックス付のCSSプロパティを書くことでその先行機能を利用することができるようになります。
ベンダープレフィックスには以下の種類があります。
| ベンダープレフィックス | 対応ブラウザ |
| -webkit- | Chrome、Safari |
| -moz- | Firefox |
| -ms- | Internet Explorer |
ベンダープレフィックスの使用例
ベンダープレフィックスの使用例です。
a {
-webkit-transition: all 1s linear 0;
-moz-transition: all 1s linear 0;
-ms-transition: all 1s linear 0;
transition: all 1s linear 0;
}
特に記載の順番は決まっていませんが、「ベンダープレフィックスなし」を最終行に書くようにして下さい。!importanrt指定がない限り、後に書いた方で上書きになるCSSの特徴を利用して、草案から正式勧告となった場合に「ベンダープレフックスなし」を適用させるためです。
ベンダープレフィックスの管理
W3Cでは、CSS3の草案段階（WD）から勧告候補（CR）になったら時点でベンダープレフィックスを外すことが推奨されています。厳密な管理方法としてはベンダープレフィックスを勧告候補になった時点で外す（ベンダープレフィックスを削除してベンダープレフックスなしのみにする）必要があります。
ベンダープレフィックスを使うべきか
現在はできるだけベンダープレフィックスの使用を避けるべきです。
Microsoft Edgeにはベンダープレフィックスがありません。何故でしょうか？それはMicrosoft EdgeはW3Cの勧告に従っており、草案段階の先行実装がないからです。
Microsoft EdgeはWindows10と併せて2015年7月に登場したブラウザです。W3CのCSS3勧告は2012年末に主要な機能についてはほぼ勧告が完了していました。このため、Microsoft EdgeはHTML5、CSS3に対応したブラウザとして誕生しました。
一方で、その他Chrome、Safari、Firefox、Internet Explorer、Operaは2012年以前より存在するブラウザです。これらブラウザが勧告前の過渡期にベンダープレフィックスを利用してCSS3の機能を先行提供していたのです。
こういった経緯の中、現在ではほとんどの機能が勧告として出尽くしている状況ですので、「ベンダープレフィックスなし」だけでサイト構築できますし、支障ありません。今後CSS4(level4)の草案、勧告が大量に出てくれば話は別ですが、ベンダープレフィックスを使用して正式勧告になったら削除するという無駄な管理作業を発生させないためにも、「ベンダープレフィックスなし」だけでサイト構築するべきです。