CSS3 Reference


background-clip

背景画像の描画領域

試す

コード

※一番上の例のみです。

#containe p {
    background-clip: border-box;
    -moz-background-clip: border-box;
    -webkit-background-clip: border-box;
}

サンプル

書いてある描画方法で描画されていれば対応しています。

border-box(ボーダー外線まで背景を表示)

padding-box(パディング外線まで背景を表示)

content-box(内容枠まで背景を表示)

対応ブラウザ

Firefox
1.0~
Chrome/Safari
3.0~
Opera
10.5~
InternetExplorer
9

パラメータ

[border-box | padding-box | content-box][, [border-box | padding-box | content-box]]*
初期値border-box
適用すべての要素
継承しない
レベル3
%の解釈-
適用メディアVisual
参考文献CSS Backgrounds and Borders Module Level 3#3.7. The ‘background-clip’ property

解説

背景の描画領域を指定します。

border-box
背景はボーダーボックスの範囲に描画されます。
padding-box
背景はパディングボックスの範囲に描画されます。
content-box
背景は内容ボックスの範囲に描画されます。

Firefoxについては、1.0~3.6までは”-moz-background-clip”というプロパティになっています。また、Safari/Chromeについても、”-webkit-background-clip”というプロパティになっています。

コメントする


トラックバック

投稿されたコメント