WEB業界で働く人や興味がある人に役立つ情報サイト“qam（カム）”

投稿者： qam
カテゴリー： マークアップ >CSS

今日は、ちょっと使う機会が増えてきたCSS3についてです。

やっぱり、角丸ってついつい使いたくなるのですが、
なんせコーディングがめんどくさい！（笑）

CSS3だと簡単に表現できるのに、IEがなかなか対応してくれない。。
そこで便利なのが、「border-radius.htc」です。

とって言っても、そんなの知ってるよ～って方が多そうですが･･･；

使い方は簡単です！

まずは、こちらからファイルをダウンロードして・・・
角丸にしたいdivのCSSの1行加えるだけ！

こんな感じです↓↓

-moz-border-radius   : 4px;
-webkit-border-radius : 4px;
border-radius : 4px;
behavior : url(border-radius.htc);

これは、IEの独自拡張子プロパティのbehaviorを使って実装しているそうです。

今回は角丸ですが、他にも影をつけたりできるhtcファイルもあったり・・・。
探してみるともっと便利なものがあるかも？

また何か見つけたら、記事にしたいと思います。
みなさんも探してみてくださいね～。

追記：
紹介したhtcですが、どうやら印刷には対応していないようです。
印刷について配慮しながらの実装がよいかもしれません・・・。