css讓圖片鋪滿的方法:可以使用background-size:cover樣式設置背景圖片鋪滿。background-size屬性規定背景圖像的尺寸。
豌豆資源搜索網站https://55wd.com 廣州vi設計公司http://www.maiqicn.com
豌豆資源搜索網站https://55wd.com 廣州vi設計公司http://www.maiqicn.com
background-size 屬性:
background-size 屬性規定背景圖像的尺寸。
語法:
background-size: length|percentage|cover|contain;
默認值:auto
繼承性:no
版本:css3
JavaScript 語法:object.style.backgroundSize="60px 80px"
屬性值:
值 | 描述 |
---|---|
length | 設置背景圖像的高度和寬度。 第一個值設置寬度,第二個值設置高度。 如果只設置一個值,則第二個值會被設置為 "auto"。 |
percentage | 以父元素的百分比來設置背景圖像的寬度和高度。 第一個值設置寬度,第二個值設置高度。 如果只設置一個值,則第二個值會被設置為 "auto"。 |
cover | 把背景圖像擴展至足夠大,以使背景圖像完全覆蓋背景區域。 背景圖像的某些部分也許無法顯示在背景定位區域中。 |
contain | 把圖像圖像擴展至最大尺寸,以使其寬度和高度完全適應內容區域。 |
background-size:cover樣式設置背景圖片鋪滿示例:
<!DOCTYPE html> <html> <head> <style> body { background:url(/i/bg_flower.gif); background-size:cover; -moz-background-size:cover; /* 老版本的 Firefox */ background-repeat:no-repeat; padding-top:80px; } </style> </head> <body> </body> </html>