如何使用CSS設置圖像寬度和高度100％？

background:url(images/menu_edu.jpg) no-repeat;

不過是越來越只顯示圖像的一半。

2010-07-03 mina

也許你應該展示更多的代碼...很難說出爲什麼只發生在一行上：） – rabidmachine9 2010-07-03 12:12:16

具有背景的元素需要是圖像的大小。

即爲Flower.jpg = 255px X 55像素

<div class="flower"> 
    Some text 
</div> 

.flower { 
    background: url(flower.jpg) no-repeat; 
    width: 255px; 
    height: 55px; 
}

如果您使用的背景元素的尺寸不能被設置到圖像的尺寸。你可以使用javascript來計算尺寸。

或者，如果您需要重複圖像，則可以在背景標記上使用repeat，repeat-x或repeat-y。

2010-07-03 12:12:02 Marko

您未顯示足夠的代碼，但如果背景圖像位於body元素中，則可能無法在整個視口中伸展。

嘗試

html, body { min-height: 100% }

2010-07-03 12:13:19

查看端口只顯示圖像的一半是什麼？ – Starx 2010-07-03 12:19:37

@starx嘗試給'body'一個'background-image'，而不是將它擴展到100％高度，你會明白我的意思。 – 2010-07-03 12:25:58

如果你只是想顯示的圖像時，IMG標籤更加有用和有效的... ...（而且它可以被設置爲寬度（/ &）高度= 100％）。

2010-07-03 12:16:05 fb55

如果你想顯示在全尺寸圖像，無需使用CSS這個

不給高度和寬度屬性爲<img>標籤就像 <img src="this.jpg" />將在全尺寸顯示

但如果你想讓你的<div>以全尺寸顯示它的背景，那麼除了分配確切的圖像尺寸外，沒有別的選擇了

2010-07-03 12:18:28 Starx

回答