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にログインしてコメントする

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