CSS3の新しい書き方教えてください。

ネットで見ていたところ以下の記述を見つけました。
どうやらCSS3の記述らしいのです。

border: 1px solid #333;
-webkit-border-top-left-radius: 3px;
-webkit-border-top-right-radius: 3px;
-webkit-border-bottom-right-radius: 0px;
-webkit-border-bottom-left-radius: 0px;
-moz-border-radius-topleft: 3px;
-moz-border-radius-topright: 3px;
-moz-border-radius-bottomright: 0px;
-moz-border-radius-bottomleft: 0px;


border-top-left-radius: 3px;　という記述は何となく分かるのですが、その頭にある・・・。

-webkit-　という記述は何を意味するのでしょうか？？
-moz-　もそうですね・・・。

先頭の、border: 1px solid #333; に付随する記述だよ！みたいな感じでしょうか？

どなたかお分かりになる方いらっしゃいましたらアドバイスをお願いします。
また、何か参考になるサイトなどもご存知であれば、合わせてお教えいただけますと幸いです。

どうぞ、宜しくお願いします。

No.1 ベストアンサー 回答者： lilillllililili 回答日時： 2012/03/27 13:17

CSS3に完全に対応しているブラウザは極僅かしかありません。

そんな中、各ブラウザは独自の仕様を実装しました（先行実装）。

-moz-が先頭にあるプロパティはMozilla/Firefox独自プロパティです。
-webkit-が先頭にあるものはSafari独自プロパティです。

これらはborderプロパティと関係するものではありません。
border-radiusは角を丸めるプロパティで、今回の例でしたら本来は次のように書きます。
　border-radius: 3px 3px 0px 0px;

こちらのサイトが参考になります。
> http://css-eblog.com/summary/css3-summary.html

この回答へのお礼

有難う御座います。

アドバイスを元に調べていましたら、ベンダープレフィックスというキーワードに行き着きました。
要は、まだルールが確立されていない故に必要な定義・・・。との認識でよいのでしょうか？

お礼日時：2012/03/27 14:38

No.3 回答者： Tacosan 回答日時： 2012/03/27 13:21

その部分は「CSS3 の」ってわけでもないらしいよ.

参考URL：http://www.w3.org/TR/CSS2/syndata.html#vendor-ke …

この回答へのお礼

有難う御座います！
なるほど、CSS3固有と言うわけではないのですね。

お礼日時：2012/03/27 14:38

No.2 回答者： kosukejlampnet 回答日時： 2012/03/27 13:19

http://www.htmq.com/csskihon/603.shtml

この回答へのお礼

有難う御座います！

お礼日時：2012/03/27 14:38