2012-02-28 45 views
-1

我有一個流體佈局,並且我有一個div,它始終與瀏覽器窗口的高度和寬度相匹配,即使在瀏覽器調整大小時也是如此。所以div是100%的高度和100%的瀏覽器窗口寬度。如何在流體DIV內縮放和居中對齊嵌入式圖像?

在這個div內,我有一個圖片,適合其父母的寬度和高度的100%。所以理論上這個圖像將是全屏。目前,當您將瀏覽器窗口放大時,圖像大小會超過其父級的圖像大小,並在右側&圖像的底部被切斷。

如何在瀏覽器窗口放大時切斷圖像的所有邊緣?所以我想我想垂直居中在其父母的圖像。

所有圖像/ div的寬度是使用百分比計算的。

這裏的鏈接到我的現有代碼:http://jsfiddle.net/PfzQ8/4/

編輯:那的jsfiddle是沒有問題的代碼,它只是我的代碼目前已經和想在其展開。

+0

我不認爲我能夠重現您問題在jsfiddle使用Chrome。此外,您是否希望圖像伸展以填充可用空間的100%,或者按比例縮放以填充寬度或高度的100%? – Kyle 2012-02-28 15:15:55

+0

沒有出現你試圖搜索這個主題...有一個解決方案的所有很容易發現在快速搜索 – charlietfl 2012-02-28 15:52:55

+0

@charlietfl我相信我的問題是不同的,因爲它的流體佈局,我不知道的高度我的容器,並希望從DIV的中心將我的圖像縮放到大約400%(例如)。因此,認爲投票下來是有點苛刻,因爲我似乎無法找到任何解決方案,在StackOverflow。我可以嘗試這個解決方案,看看它是否會解決:http://css-tricks.com/centering-in-the-unknown/ – egr103 2012-03-01 11:11:07

回答