通过外部div容器中的CSS类更改img的属性

Question

我想通过css更改图像的属性。当我通过typo3这样做时，我只能访问外部div容器（内容元素的自定义边框）。 所以我将以下行添加到我的css文件中：

.Bild-Startseite img { width:50%; }

div容器正在使用Bild-Startseite。不幸的是，这不会改变div容器内图像的宽度...... 出了什么问题？

css文件位于：http://web182.theta.ibone.ch/klingler_ag/fileadmin/templates/css/screen/screen-PAGE-layout.css

包含div容器的网站：http://web182.theta.ibone.ch/klingler_ag/home.html

由于

Answer 1

问题是更具体的选择器已经定位到<img>：

#main img, 
#main audio, 
#main video, 
#main embed {
height: auto;
width: auto;
max-width: 100%;
/* ID's will always take precedence over classes */
}

您可以尝试在声明末尾添加!important规则..或将其添加为内联样式

.Bild-Startseite img {
 width: 50% !important; 
 }

Answer 2

有两种方法可以解决。

1

.Bild-Startseite img { width: 50% !important; }

2

#main img,
#main audio,
#main video,
#main embed {
    max-width:100%;
    height:auto;
}

in screen-PAGE-layout.css, remove width attribute.

Answer 3

这是有效的;只有一些其他css规则具有更高的特异性。

使用：

.Bild-Startseite img { width: 50% !important; }

覆盖应用于此元素的所有其他width。