css - CSS 和图像大小

Question

我想要一个 CSS 类和/或解决方案，其中图像为 100% 宽度（高度为自动），但最大自身大小。无论如何要实现这一点，还是我需要逐个图像指定最大宽度？

Answer 1

如果你设置：

width: 100%;
height: auto;

图像将与其容器一样大。宽度和高度之间的比例将保持不变。

如果图像的宽度低于容器的宽度，那么它将被缩放直到它适合可用空间。在这种情况下，您可能需要使用：

max-width: 100%;
height: auto;

Answer 2

这应该这样做：

    img {
        max-width: 100%;
        height: auto;
    }

如果窗口大于图像，则图像不会被缩放。如果窗口小于图像，则图像应缩放。我注意到你说你对克拉西米尔的回答没有评论。您可能想检查是否有其他 CSS 可能会改变这种行为。