CSS和圖像 - 爲什麼圖片沒有調整大小

爲什麼當我想調整div的大小時，div中的圖像不會改變它的大小！這是CASCADE樣式表，不是嗎？CSS和圖像 - 爲什麼圖片沒有調整大小

- 編輯 -

.box{padding:0px;margin-left:10px;display:inline-block;margin-right:auto;width:20px;height:20px;border:1px solid red;} 

<div class="box"> 
<img src="larrow.gif"/> 
</div>

來源

2011-04-03 oneat

圖像的大小是如何指定的？ – Oded 2011-04-03 18:22:59

用於應用樣式的選擇器是否與'img'匹配？ – David 2011-04-03 18:24:15

這是級聯的，但寬度和高度不能被繼承。

您可能想要做一些事情來使圖像遵循其父項的大小。

像

div.box img { width: 100%; height: 100%; }

來源

2011-04-03 18:23:38 kapa

我有一個問題：圖像何時需要**父元素**的100％，什麼時候需要**頁**的100％？ – JCOC611 2011-04-03 18:27:19

我覺得當頁面是屏幕元素或定位是絕對 – oneat 2011-04-03 19:06:45

<img>標籤要麼圖像的自然寬度，或者必須用CSS來重寫標籤的width屬性的隱式寬度。試試這個，使其父<div>的寬度圖像100％：

div img{ 
    width: 100%; 
}

我覺得你有一點什麼級聯實際上是一種誤解。我建議你閱讀part of the spec that deals with the cascade。

來源

2011-04-03 18:24:18

這種方法是最好的，因爲它會保留圖像的比例。 – jackJoe 2011-04-03 18:28:33

您的樣式選擇器只匹配box類的元素。 div有這個類，但img沒有。因此，div具有應用的樣式並且img不具有樣式。嘗試：

.box 
{ 
    padding:0px; 
    margin-left:10px; 
    display:inline-block; 
    margin-right:auto; 
    border:1px solid red; 
} 
.box, .box img 
{ 
    width:20px; 
    height:20px; 
} 

<div class="box"> 
    <img src="larrow.gif"/> 
</div>

來源

2011-04-03 18:27:13 David

CSS和圖像 - 爲什麼圖片沒有調整大小

回答

相關問題