图片大小浏览器高度 - X像素数。仅限CSS！ [英] Image size browser height - X number of pixels. CSS-only!

问题描述

我正在寻找一个纯CSS解决方案，缩小图像到浏览器窗口的大小 - X的像素数量。我发现了相当多的JavaScript解决方案，但我想使它的CSS。如果是，那么如何？

I'm looking for a CSS-only solution, to shrink an image to the size of the browser window - X amount of pixels. I've found quite a lot JavaScript solutions, but I want to make it CSS-only. Can it be done and if yes, then how?

推荐答案

这是怎么回事？

现场演示

HTML ：

<div><img src="http://www.google.com/images/logos/ps_logo2.png" /></div>

CSS ：

div {
    position: absolute;
    top: 30px;
    left: 30px;
    right: 30px
}
img {
    width: 100%
}

这篇关于图片大小浏览器高度 - X像素数。仅限CSS！的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！