search :

archive :



« 装飾系フォント46 | トップ | WordPressのブログ以外の使い方10 »

CSS3 IE クロスブラウザ 角丸

_CSS | February 06, 2010, 0:13
はてなブックマーク

CSS3でIEにも角丸を適用させるhtcファイル

CSS3で最も簡単にクロスブラウザの角丸を実装したい。

そんなときにおすすめなのが、『curved-corner』。CSS3でIEにも角丸を適用させるhtcファイルです。

Google Codeで、CSS3でIEにも角丸を実装させるファイルが配布されていますね。

クロスブラウザの角丸を実装するには、「border-radius.htc」ファイルをダウンロード、配置して、CSSに以下のように記述すればOKです。

CSS3

-moz-border-radius: 32px;//for Firefox
-webkit-border-radius: 32px;//for Safari and chrome
border-radius: 32px;//CSS3
behavior: url(border-radius.htc);//for IE

すごく簡単な方法なので、CSS3での角丸はこれで決まりなのでは、と思っちゃいますね。

デモもダウンロードできるので、ぜひ見てみてください。

Rounded corner HTML elements using CSS3


■関連記事
IEをモダンブラウザのように扱う方法10

Editor's Note

あっという間に金曜日ですね。今週もばたばただったけど、充実していました。今日はイタリアンのお店で食事してきていい気分です。

Trackback URL :

プロフィール

プロフィール

WEB制作・ブランディングを主軸とした、株式会社クリーム代表取締役。

案件につきましては、「お問い合わせページ」からお気軽にご相談ください。

Recommend

  • Josef Muller-Brockmann: Pioneer of Swiss Graphic Design
  • Who Owns The Water?
  • Helvetica: Homage to a Typeface
  • Corporate Diversity: Swiss Graphic Design and Advertising by Geigy, 1940-1970
  • Typography (Graphic Design in Context)
  • +81 voyage or Tokyo Graphic passport World Tour---At Center Pompidou in Paris and 3331 Tokyo
  • WONDERWALL ARCHIVES 01

archive :