Question

我在div中有3个图像，其中“carousel”类是背景图像。我为他们定义了一种风格如下：

.carousel img {
    position: absolute;
    top: 0;
    left: 0;
    min-width: 100%;
    height: 500px;
}

我不希望此样式应用于带有类轮播的div中的另一个图像（即徽标图像），因为以下样式应该适用：

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

我的HTML如下 - 如何排除徽标图像，使其不使用.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;
}

CSS - 从继承父样式中排除子项

1 个答案: