CSS background-position的使用說明詳解

2024-07-11 08:46:01

字體：大中小

來源：轉載

供稿：網友

background-position的說明：
設置或檢索對象的背景圖像位置。必須先指定 background-image 屬性。該屬性定位不受對象的補丁屬性( padding )設置影響。
默認值為： 0% 0% 。此時背景圖片將被定位于對象不包括補丁( padding )的內容區域的左上角。
如果只指定了一個值，該值將用于橫坐標。縱坐標將默認為 50% 。如果指定了兩個值，第二個值將用于縱坐標。
如果設置值為 right center，因為 right 作為橫坐標值將會覆蓋 center 值，所以背景圖片將被居右定位。
對應的腳本特性為 backgroundPosition 。

語法：
background-position : length || length
background-position : position || position

取值：
length : 百分數 | 由浮點數字和單位標識符組成的長度值。
position : top | center | bottom | left | center | right

background-position -- 定義背景圖片的位置

取值:
[ <percentage> | <length> | left | center | right ] [ <percentage> | <length> | top | center | bottom ] ]
* 水平
left: 左
center: 中
right: 右
* 垂直
top: 上
center: 中
bottom: 下
* 垂直與水平的組合
x-% y-%
x-pos y-pos

初始值: 0% 0%
繼承性: 否
適用于: 所有元素
background:背景.position:位置.

重點講解的地方：

復制代碼

上一篇：css ID類和class類的長命名與短命名

下一篇：利用CSS定位背景圖片 background-position