CSS 3で追加された背景に関するプロパティ：FirefoxとSafariのCSS対応

エ・ビスコム・テック・ラボ
2008/02/29 08:00

CSS 3とFirefox、Safari 3の背景に関するプロパティを、まずは表でまとめてみる。

　CSS 3の草案「CSS3 Backgrounds and Borders Module」では、次のような背景に関するプロパティが新しく追加されており、背景の範囲や表示位置などをより細かく指定できるようになっている。

CSS 3で追加された背景に関するプロパティ
プロパティ機能
background-clip背景の表示範囲を指定する
background-origin背景画像の表示位置の基点を指定する
background-size背景画像の大きさを指定する
background-breakインライン要素の背景画像の繰り返し方を指定する

　Firefoxは、バージョン3以前からbackground-size以外のプロパティをサポートしており、「-moz-」を付けたプロパティ名で利用することができる。ただし、background-breakは「-moz-background-break」ではなく「-moz-background-inline-policy」となっているので、注意したい。

　一方、Safariはバージョン3からbackground-break以外の3つのプロパティをサポートし、「-webkit-」を付けたプロパティ名で利用することができる。

CSS 3のプロパティと各ブラウザで利用できるプロパティ
CSS 3FirefoxSafari
background-clip-moz-background-clip-webkit-background-clip
background-origin-moz-background-origin-webkit-background-origin
background-size未対応-webkit-background-size
background-break-moz-background-inline-policy未対応

　今回は、background-clipとbackground-originについて見ていきたい。

記事に関係する情報をコメントでお寄せください

ニックネーム : CNET_IDにログインしてコメントする

コメント本文（必須） :
  • 新着記事
  • 人気記事
  • 特集
  • ブログ
  • 話題のタグ
インストール 開発環境 Windows 7 UI ソフトウェア開発 クラウド Google Off Topic Webデザイン 小技 Windows CSS 脆弱性 HTML Apple WebKit Chrome オープンソース リファレンス 仮想化 Windows Vista OS Safari Java Webサービス モバイル ブラウザ プログラミング言語 Microsoft Internet Explorer Windows XP Mozilla アプリケーション Database Ajax セキュリティ Flash iPhone 3G Tips Firefox JavaScript iPod touch Firefox 3 マイクロソフト RIA Linux データベース Opera Mac OS X iPhone
  • 話題のタグを見る »