jquery - 最小高度不缩放

Question

我想在所有 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-Tag 会根据宽度自动缩放。但这在 IE 中不起作用。图像只是垂直缩放。

谁能帮帮我？

Answer 1

如果您希望图像宽度始终跨越整个浏览器窗口，您必须确保设置了 body 和父级容器(在本例中为 outer)具有 width: 100% 以便宽度百分比对后代正确工作。然后，将图像的显式宽度设置为 100%，高度应自动缩放。

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

jsfiddle