實(shí)例

指定背景圖像的大?。?/p>

div
{
background:url(img_flwr.gif);
background-size:80px 60px;
background-repeat:no-repeat;
}

嘗試一下 ?
在此頁(yè)底部有更多的例子。

瀏覽器支持

表格中的數(shù)字表示支持該屬性的第一個(gè)瀏覽器版本號(hào)。

緊跟在 -webkit-, -ms- 或 -moz- 前的數(shù)字為支持該前綴屬性的第一個(gè)瀏覽器版本號(hào)。

Property          
background-size  4.0
1.0 -webkit-		 9.0 4.0
3.6 -moz-		 4.1
3.0 -webkit-		 10.5
10.0 -o-

標(biāo)簽定義及使用說(shuō)明

background-size屬性指定背景圖片大小。

默認(rèn)值: auto
繼承: no
版本: CSS3
JavaScript 語(yǔ)法: object object.style.backgroundSize="60px 80px"

語(yǔ)法

background-size: length|percentage|cover|contain;
值 描述
length 設(shè)置背景圖片高度和寬度。第一個(gè)值設(shè)置寬度，第二個(gè)值設(shè)置的高度。如果只給出一個(gè)值，第二個(gè)是設(shè)置為"auto(自動(dòng))"
percentage 將計(jì)算相對(duì)于背景定位區(qū)域的百分比。第一個(gè)值設(shè)置寬度，第二個(gè)值設(shè)置的高度。如果只給出一個(gè)值，第二個(gè)是設(shè)置為"auto(自動(dòng))"
cover 此時(shí)會(huì)保持圖像的縱橫比并將圖像縮放成將完全覆蓋背景定位區(qū)域的最小大小。
contain 此時(shí)會(huì)保持圖像的縱橫比并將圖像縮放成將適合背景定位區(qū)域的最大大小。

Examples

在線實(shí)例

拉伸背景圖像
拉伸背景圖像完全覆蓋內(nèi)容面積。

四個(gè)背景圖像圖像橫向拉伸
拉伸4個(gè)橫向背景圖片。

相關(guān)文章

CSS3 教程: CSS3 背景