共用方式為

background-position

  • 發行項

設定或擷取物件背景的位置。

語法

{ background-position: sPosition }

可能的值

sPosition

指定或接收下列任一或兩個值的字串：

length

浮點數值，後接絕對單位指示項 (cm、mm、in、pt 或 pc) 或相對單位指示項 (em、ex 或 px)。

percentage

後接百分比符號 (%) 的整數。此值為物件寬度或高度的百分比：

  • 垂直對齊值。可能的值包括：

    • top   垂直對齊頂端。

    • center   置中垂直對齊。

    • bottom   垂直對齊底部。

  • 水平對齊值。可能的值包括：

    • left   水平對齊左側。

    • center   置中水平對齊。

    • right   水平對齊右側。

此屬性的預設值為 0% 0%。這不是繼承屬性。

備註

如果只設定一個值，該值會套用至水平座標，而垂直座標則會設為 50%。如果設定兩個值，第一個值會套用至水平座標，而第二個值會套用至垂直座標。

將值設為 0% 0% 會把 background-image 放置在元素內容左上角不包括邊框的位置。

指定 right center 有下列效果：由於 right 視為 X 座標方向，因此 right 會覆寫 center 值，使背景隨著向右偏移。

此屬性可利用 background 複合屬性，連同其他背景屬性一併設定。

範例

下列範例使用 background-position 屬性來指定背景影像的位置。此範例會呼叫內嵌 (全域) 樣式表以移動球體：

<style>
    .style1 {background-position:top center}
    .style2 {background-position:bottom right}
</style>
</head><body onload="ospan.className='style1'">
<span style="font-size:14; width:250;" id="ospan"
      onmouseover="this.className='style2'"
      onmouseout="this.className='style1'">
. . . 
</span> 

標準資訊

此屬性是在階層式樣式表 (CSS) 層級 1 (CSS1) (英文) 中定義。

適用於

A、ADDRESS、B、BIG、BLOCKQUOTE、BODY、BUTTON、CAPTION、CENTER、CITE、CODE、COL、COLGROUP、CUSTOM、DD、DEFAULTS、DFN、DIV、DL、DT、EM、FIELDSET、FORM、HN、HTML、I、IMG、INPUT TYPE=BUTTON、INPUT TYPE=CHECKBOX、INPUT TYPE=FILE、INPUT TYPE=IMAGE、INPUT TYPE=PASSWORD、INPUT TYPE=RADIO、INPUT TYPE=RESET、INPUT TYPE=SUBMIT、INPUT TYPE=TEXT、LI、OL、P、S、SPAN、SUB、TABLE、TBODY、TD、TFOOT、TH、THEAD、TR、TT、U、UL、VAR、XMP

請參閱

概念

background