css中background相關屬性

background-origin: 規定 background-position 屬性相對於容器的哪一部分來定位。

　　padding-box 背景映像相對於內邊距框來定位；（預設）

　　border-box背景映像相對於邊框盒來定位；

　　content-box背景映像相對於內容框來定位。

background-position：設定背景映像在容器顯示的起始位置。

　　預設值：0 0（從背景圖的左上點開始顯示）；

　　取值:Int px Int px;背景圖的左上定點在容器的座標位置，可以為負值。負值表示背景圖左上點不在容器內，超出的部分隱藏。

　　如果只設定一個值，另一個值將為“置中”（50%/center）

　　如果採用百分數，則按如下公式計算座標：

　　x：(容器的寬度—背景圖片的寬度)*x百分比，超出的部分隱藏;y：(容器的高度—背景圖片的高度)*y百分比，超出的部分隱藏。

　　 所以left/top等價於0%，right/bottom等價於100%（背景圖的右邊/底邊和容器重合），center等價於50%（背景圖在容器中間）。

background-size:設定背景圖的大小（IE8不支援此屬性）

　　百分比/length：若為百分數，背景圖的尺寸為容器乘以百分數的乘積。只設一個，第二個為auto（以保持和原始背景圖一樣的長寬比例）。

　　如果都設為100%，則背景圖會鋪滿容器，但長寬比率會發生變化。

　　contain:容器按背景圖的固定比例包含整個背景圖。背景圖的尺寸以背景圖按固定比例放大，其任意一條邊到達容器的邊界為止，經常會導致另一邊空白(有no-repeat時)。

　　cover:背景圖按固定長寬比放大，至填充滿整個容器為止（背景圖短一點的那條邊也到達容器邊界）。有一部分的背景圖會因超出容器而被切除。

IE8相容：

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='絕對路徑',sizingMethod='scale/crop');

　　crop : 背景圖大小不變，剪下圖片以適應地區尺寸。

　　image : 預設值。增大或減小地區的尺寸邊界以適應背景圖的尺寸，相當於overflow：visible的效果。

　　scale : 縮放背景圖以適應地區的尺寸邊界。

　　①不能指定任意大小background百分比②只適於單張圖片不能使用圖片精靈等拼圖③要引用絕對路徑圖片④相容ie7，8