圖像縮放大小依賴於瀏覽器的大小

Question

使用本網站作爲一個例子：http://www.reebok.com/en-GB/

頭的div高度調整依賴於瀏覽器的尺寸，與內內容具有100％的高度&寬度。

這是由JavaScript控制的這可以完全用CSS來完成嗎？

Answer 1

你只能在html & css的幫助下做到這一點。像這樣寫：

img{ 
width:100%; 
height:auto; 
} 

檢查這個http://jsfiddle.net/e8V47/

Answer 2

在您的示例圖像是通過瀏覽器調節，它在，如果你只設置了寬度或高度，瀏覽器會自動調整另一個。

Answer 3

在您的頁面中，它實際上是使用Javascript。

容器的高度被修改行內的（style屬性）

<div class="module module-hero use-full-width displayed" data-module="Hero" style="height: 232px;"> 

這不過可以做類似的事情與CSS，使用高度%。例如：

.module{ 
    height:40%;  // A percentage relative to the parent element 
}