昨年末からウェブ制作の勉強を再開して未だウラシマ状態の私です。
さて今回は、CSSの中でwebkitとかmozとか、昔は見なかったCSSの表記について。
現役バリバリの人は読む必要ないです。
具体的に使われてるところ
昔(約10年前)に比べて、CSSで出来ることが無茶苦茶増えた。
参考サイトからスタイルをコピーしようとしても、見慣れない表記が多くて、最初は都度調べてたので随分時間を食うことに…。
その中でも一際目立った意味不明な奴らが表題のwebkitとかmoz!
border-radius: 5px 5px 5px 5px;
-webkit-border-radius: 5px 5px 5px 5px;
-moz-border-radius: 5px 5px 5px 5px;
こんな感じで使われてる。
上の例は角丸ボーダーを表示するときのやつ。
最初はオマジナイ(プログラマ業界でよく分からないけど書かないといけないコードをこう言うよ)だと思って無視してたけど、
そろそろ意味を理解しないとってことでググってみた。
CSSベンダープレフィックス
「webkit」でググったら、「CSSベンダープレフィックス」とかいう言葉が出てきた。
CSS3で採用されるはずの機能を各ブラウザが先行して実装しており、要は各ブラウザの特化表記ってことらしい。
-moz- | Firefox |
---|---|
-webkit- | Chrome、Safari |
-o- | Opera |
-ms- | Internet Explorer |
なるほど。