CSS媒体查询img max-width不起作用

Question

我有一个包含大量条件媒体查询语句的样式表。范围从iPhone分辨率到1600px。但是我想在一个特定的div流体中制作img，就像在浏览器窗口调整大小时重新调整大小一样，无论已经编写条件@media查询语句。我尝试使用

img { max-width: 100%}

但它根本不起作用，无论浏览器的寡妇如何，图像都保持不变。为了使它有效我添加！重要的是在属性的末尾，甚至粘贴在从iPhone分辨率到1600px的所有媒体查询语句中，但它不起作用。

无论已经编写的媒体查询如何，我如何产生这样的效果，我希望当浏览器窗口发生变化时，图像在某个div中变得灵活。

我添加了

#inner_container img { max-width:100% !important; }

在此样式表的末尾

http://strongcodelabs.com/test/css/style.css

Answer 1

如果您只想为较小的屏幕调整大小而不是在较大的屏幕上缩放图像，这应该足够了：

#inner_container  img{
    width: auto;
    max-width: 100%;
}

在任何媒体查询之外添加它，并确保其后的任何样式都不会覆盖这些值，如果需要，请使用!important。