CSS中的图像最大宽度为50％

Question

我有一张图片：

img src="images/logo.png" class="img-small float-left">

我想要只有50％的宽度：

.img-small {
    max-width: 50%;
}

但这似乎不起作用，它在一个小窗口中超过50％。我也尝试了px值，但没有运气......

我还有一个.small类，它也会调整文本大小，这就是为什么我把这个称为.img-small。有没有一种方法可以命名.small，一个可以调整文本大小和其他图像？

这是网站：http://www.kine-stammheim.ch/

和CSS：http://www.kine-stammheim.ch/css/screen/screen-PAGE-layout.css

Answer 1

  

但这似乎不起作用。

截至您发布的链接确实有效。请告诉我们，确切的问题是什么。

<强>更新 您使用更高的特异性将图像设置为100％宽度：

#main img { max-width: 100%; }

你需要更高的特异性来覆盖它。

#main img.small { max-width: 50%; } /* don't do that */

但我认为更好的解决方案是不使用ID来设置这样的全局属性。

img { max-width: 100%; }
img.small { max-width: 50%; }

  

我有一个.small类也可以调整文本大小，这就是为什么我把它称为.img-small。有没有办法可以同时命名.small，一个会调整文本大小和其他图像？

是的，你可以指定，类应该对特定元素做什么：

.small {
    font-size .8em;
}

img.small {
    width: 50%;
}

Answer 2

<img src="images/logo.png" class="img-small float-left">

并试试这个

   .img-small{
       max-width:50% !important;}

Answer 3

确保您的图片代码不带高度和宽度属性。