CSS:使用 Tumblr 'Astronaut' 主题进行图像缩放

Question

我对 CSS 一无所知，并尝试使用免费的 Tumblr 主题“宇航员”。

目前，我正在尝试弄清楚如何针对博客的“面部”(采用三行样式)按比例缩放图像，同时保持主要帖子本身的图像完好无损。我试过找出 width:300px (虽然这只是对每个“行”的最大宽度是多少的猜测)和 height:auto 标签在他们的 block 中的位置，但它似乎没有用.这是文本帖子独有的，图片帖子可以正常工作。

The site, for reference.

And a pastebin of the layout.

感谢您能给我的任何帮助。

Answer 1

通过将 height: auto; 添加到您的 CSS 中，再次尝试您在问题中提到的内容:

#container .box img {
    max-width: 100%;
    height: auto; /* add this! */
}

如果图像较大并保持图像的正确比例，这应该将图像缩小到父元素的可用宽度。