javascript - 以 100% 宽度或适合浏览器的大小显示图像

Question

如何显示图像，使其宽度为原始图像宽度或浏览器宽度的 100%，以较小者为准(我想在不水平滚动的情况下显示尽可能多的图像)。

这可以用 CSS 实现吗，还是我需要尝试使用 javascript？

Answer 1

试试这个:jsFiddle.net Demo

HTML:

<img src="http://gypsypixiepirate.com/wp-content/uploads/2013/03/Rumpus-party.jpg" class="className" />

CSS:

.className {
    max-width: 100%;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
    margin: auto;
    overflow: auto;
    position: fixed;
}