語法：
background-position : length || length
background-position : position || position
取值：
length : 百分數 | 由浮點數字和單位識別符號組成的長度值。請參閱 長度單位
position : top | center | bottom | left | center | right
說明：
設定或檢索物件的背景影象位置。必須先指定 background-image 屬性。
該屬性定位不受物件的補丁屬性( padding )設定影響。
預設值為： 0% 0% 。此時背景將被定位於物件不包括補丁( padding )的內容區域的左上角。
如果只指定了乙個值，該值將用於橫座標。縱座標將預設為 50% 。如果指定了兩個值，第二個值將用於縱座標。
如果設定值為 right center ，因為 right 作為橫座標值將會覆蓋 center 值，所以背景將被居右定位。
對應的指令碼特性為 backgroundposition。
注：本文中使用的大小為 300px*120px，為了能很清晰的表達圖形的哪部分被隱藏了，按照的大小 平均分成了9等份。同時背景容器區域繪製出綠色邊框清晰顯示容器的 範圍。
1、background-position:0 0;
背景的左上角將與容器元素的左上角對齊。該設定與background-position:left top;或者background-position:0% 0%;設定的效果是一致的。例如：
.container
效果如下圖1：
圖 12、該屬性定位不受物件的補丁屬性( padding )設定影響。
例如，我們給容器元素增加padding值，背景的左上角還是與容器元素的左上角對齊。在此處只是影響到了容器元素的高度和寬度。
.container
效果如圖2：
圖 23、background-position:-70px -40px;
.container
效果如圖3：
圖 34、background-position:70px 40px;
.container
效果如圖4：
圖 45、background-position:50% 50%;
水平和垂直居中。與 background-position:center center;效果等同。
等同於x：*x百分比，超出的部分隱藏。
等同於y：*y百分比，超出的部分隱藏。
例如： .container
其x=(300-210)*50%=45px;
y=(150-120)*50%=15px;
效果如圖5：
圖 5由於超出部分別往兩端延伸，所以我們可以先製作一張寬度足夠寬設定水平值為50%，這樣可以用來適應不同的瀏覽器，使得水平充滿瀏覽器視窗 並且居中。替代margin:50 auto的功能。
6、background-position:-50% -50%;
等同於x：-*x百分比，超出的部分隱藏。
等同於y：-*y百分比，超出的部分隱藏。
.container
效果如圖6：
圖 67、background-position:100% 100%;
處於容器元素的右下角，與 background-position:right bottom;效果等同。
示例：.container
效果如圖7：
background position屬性用法
background url images list01.png no repeat 0 center background url images bg.png no repeat 4px 3px background url images list01.png no repeat 0 center...
background position用法詳解
語法 background position length length background position position position 取值 length 百分數 由浮點數字和單位識別符號組成的長度值。請參閱 長度單位 position top center bottom left c...
background position 個人理解
background position 這裡先說畫素 百分比比較複雜 background position xxpx xxpx 這裡第乙個值指的是x軸座標 第二個值是y軸座標 這裡使用的座標系和數學中的座標系不同 它大概是這樣的 x軸 vy軸 先說說比div小得情況 此時移動的是 再說說幾個特殊的...