div根據頁面寬度自動調整高度

我有一個寬度爲100％的div，我需要根據頁面寬度有多少像素來調整同一div的高度。原因是因爲圖像在div的整個寬度上伸展，並且如果我設置了固定的高度，不同的分辨率將使其呈現出不同的效果，並且圖像看起來會伸展。div根據頁面寬度自動調整高度

有沒有解決這個問題的CSS？

2012-08-11 kidA

請給一些代碼 – Enve 2012-08-11 22:53:51

你可以把它作爲auto：

<div id="mydiv"><img src="..." /></div> 

#mydiv,#mydiv>img{width:100%; /*height:auto;*/}

可以省略height:auto因爲是默認值。

2012-08-11 22:56:41 Oriol

謝謝！這工作像一個魅力。我在一個子元素的其他地方定義了高度，這就是爲什麼它不起作用。 – kidA 2012-08-11 23:15:42

@ user1572447如果有效，那麼您可以將其標記爲您的問題的答案（單擊左側選票下方的勾號大綱）:) – starbeamrainbowlabs 2012-08-12 09:18:40

你可以做到這一點與CSS媒體查詢看到http://www.w3.org/TR/css3-mediaqueries/

基本上你有一個像一堆媒體查詢如下：

@media (min-width: 1024px) { 
    div {height: 200px;} 
}

寬度和高度的組合明顯變化，無論你需要，你也可以根據需要使用最大寬度或寬度

2012-08-11 22:57:33 cobaco

回答