CSS - 禁止 child 继承父样式

Question

我在一个 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>

Answer 1

将类名放在您的 IMG 标签上并直接定位它们。

.logo img.thisStyle {
    max-width: 100%;
    height: auto;
    border: 0;
    -ms-interpolation-mode: bicubic;
}