最小高度不能縮放

我想縮放所有IE瀏覽器中的圖像。最小高度不能縮放

我的代碼：

<div class="outer"><img src="text.png" /></div>

CSS

.outer { 
    position:absolute; 
    top: 0; 
    left: 0; 
    height: 100%; 
    width: 100%; 
    text-align: center; 
} 
img { 
    min-height: 100%; 
}

像這樣IMG-標籤使得與寬度的自動縮放。但是這在IE中不起作用。該圖像只是垂直縮放。

任何人都可以幫助我嗎？

來源

2013-02-21 zoom23

您無法使用這兩個元素的百分比值。 – TNK 2013-02-21 08:27:15

您定位的是哪個版本的IE？你想要什麼樣的實際結果？爲了使圖像縮放高度，相對於瀏覽器的寬度？意思是圖像始終寬度爲100％？ – 2013-02-21 08:28:36

您只給予最小高度：100％;那麼它必須縮放垂直...試試min-width-100％; – ravisoni 2013-02-21 08:32:36

如果你想在圖像的寬度總是跨越瀏覽器窗口的全部，你必須確保你設置body和養育子女的容器（在這種情況下outer）有width: 100%使寬度百分比正常工作的後裔。然後，在100%處爲圖像設置一個明確的寬度，高度應該自動縮放。

body, .outer { 
    width: 100%; 
} 
img { 
    width: 100%; 
}

jsfiddle

來源

2013-02-21 08:35:42

根據msdn，

如果包含塊的高度沒有顯式地設置，則該元件不具有最小高度和最小高度屬性解釋爲0％。

您需要明確提及父容器的高度。

body{height: 800px;} /* set your own height here */

根據Sitepoint

如果沒有明確（即，它取決於內容的高度），並且該元件沒有絕對定位，該百分比指定的包含塊的高度被值被視爲零。

來源

2013-02-21 08:56:12

好的，如果我有一個外部div圍繞outher，它是一樣的？ – zoom23 2013-02-21 08:59:30

@ zoom23請通過提供的msdn鏈接。這清楚地解釋了IE瀏覽器的完整行爲。 – 2013-02-21 09:01:45

@ zoom23以像素爲單位提及身高。它會工作。 – 2013-02-21 09:19:55

最小高度不能縮放

回答

相關問題