CSS:ベンダープレフィックス

ベンダープレフィックスとは何か

ベンダープレフィックス(接頭辞)とは、cssのプロパティの頭に付ける識別子のことで、
ブラウザごとに記述が決まっています。

-ms- ・・・・・・ Internet Explorer
-webkit- ・・・・・・ Google Chrome、Safari
-moz- ・・・・・・ Firefox
-o- ・・・・・・ Opera

なぜこういった記述が必要かと言うと、草案段階のcssプロパティを、
先行して実装、ブラウザ上に動作させる、という効果があります。

例えばこんな風に書きます。

.foo {
    -o-border-radius: 8px;
    -ms-border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
}

ですが、何でもかんでも付ければ良いというものではありません。
プロパティごとに必要最低限のプレフィックスだけ付けることが推奨されます。

また、草案から正式に勧告されたプロパティについては、プレフィックスを外すべきです。
ですが、そういった現状に気づかずに、正しいプレフィックスが付けられていない事が多々あります。

最新のプレフィックス事情については、下記のサイトで分かりやすくまとめられています。

参考:http://qiita.com/sdn_tome/items/42197e443134478befaf

Opera用のプレフィックスが今では意味をなさないものになっているというのは知りませんでした。

精度の高いコーディングをするためには、こういった最新の動向は常にチェックする必要がありますね。

admin

cl0606

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です