背景圖占據padding的內容,可以使用background-clip在調整
background-color 使用的背景顏色。
background-image 使用的背景圖像。
background-repeat 如何重復背景圖像。
background-attachment 背景圖像是否固定或者隨著頁面的其余部分滾動。
background-position 背景圖像的位置。
css3新增
background-size 背景圖片的尺寸。可以指定背景圖的大小,例如20% ?60px;
background-origin 背景圖片的定位區域。
background-clip 背景的繪制區域。
background: [background-color] [background-image] [background-repeat] [background-attachment] [background-position] / [ background-size] [background-origin] [background-clip];
background: aquamarine
url(img.png)
no-repeat
scroll
center center / 50%
content-box content-box;
background-size 屬性
一:length
該屬性值是設置背景圖像的寬度和高度的,第一個值是寬度,第二個值是設置高度的。如果只設置第一個值,那么第二個值會自動轉換為 “auto”;
二:percentage
該屬性是以父元素的百分比來設置圖片的寬度和高度的,第一個值是寬度,第二個值是高度。如果只設置一個值,那么第二個值會被設置為 “auto”;
三:cover
把背景圖像擴展至足夠大,以使背景圖像完全覆蓋背景區域。
四:contain
把圖像擴展至最大尺寸,以使寬度和高度 完全適應內容區域。