我在一个 div 中有 3 张图片,类别为“carousel”,它们是背景图片。我为他们定义了一个样式如下:
.carousel img {
position: absolute;
top: 0;
left: 0;
min-width: 100%;
height: 500px;
}
我不希望将此样式应用到 div 中带有类轮播的另一个图像(即 Logo 图像),因为应应用以下样式:
.logo img{
max-width: 100%;
height: auto;
border: 0;
-ms-interpolation-mode: bicubic;
}
我的 HTML 如下 - 如何排除 Logo 图像,使其不使用 .carousel img 样式?我尝试覆盖,但并非所有属性在 2 个样式定义之间都是相同的,因此某些属性仍然从父级 (.carousel img) 生效。
<div id="myCarousel" class="carousel">
<img src="/resources/images/background.jpg"/>" />
<div class="container">
<div class="span5">
<div class="logo">
<a href="/" title="xxx">
<img src="/resources/images/logo.png"/>
</a>
</div>
最佳答案
将类名放在您的 IMG 标签上并直接定位它们。
.logo img.thisStyle {
max-width: 100%;
height: auto;
border: 0;
-ms-interpolation-mode: bicubic;
}
关于CSS - 禁止 child 继承父样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18281258/