CSS background-origin 屬性

定義和用法

background-origin 屬性規定 background-position 屬性相對于什么位置來定位。

注釋：如果背景圖像的 background-attachment 屬性為 "fixed"，則該屬性沒有效果。

另請參閱：

CSS 教程：CSS 背景、CSS 背景（高級）

HTML DOM 參考手冊：backgroundOrigin 屬性

實例

相對于內容框來定位背景圖像：

div
{
background-image:url('smiley.gif');
background-repeat:no-repeat;
background-position:left;
background-origin:content-box;
}

親自試一試

CSS 語法

background-origin: padding-box|border-box|content-box;

屬性值

值 描述 測試
padding-box 背景圖像相對于內邊距框來定位。 測試
border-box 背景圖像相對于邊框盒來定位。 測試
content-box 背景圖像相對于內容框來定位。 測試

技術細節

默認值： padding-box
繼承性： no
版本： CSS3
JavaScript 語法： object.style.backgroundOrigin="content-box"

瀏覽器支持

表格中的數字注明了完全支持該屬性的首個瀏覽器版本。

Chrome Edge Firefox Safari Opera
Chrome IE / Edge Firefox Safari Opera
4.0 9.0 4.0 3.0 10.5