两个类似的 div 元素，一个带有一个附加类 如何在下降元素上编写颜色

Question

第一个div看起来像这样

<div class="item ui-droppable  feed masonry-brick">

第二个还有一个额外的班级小

我想在类选择器较小时修改降序元素，并将这些项目的颜色更改为黑色/属性。

我尝试了以下方法，但没有成功：

 .item .more .deliverytype {
    color: red;
    display: inline;
    font-size: 20px;
    font-weight: 500;
    position: absolute;
    right: 7px;
    text-align: right;
    top: 54px;
}

  .small .deliverytype {
    color: black;important!
}

在这里摆弄

Answer 1

只是更具体 - 不需要!important，只需使用 .small.item 即可。

.small.item .more .deliverytype {
    color: black;
}

jsFiddle 在这里 - 它有效。

由于color:red是通过.item .more .deliverytype设置的，因此您只需要添加.small。因此，如果父级同时包含.small和.item（.small.item），它将设置.deliverytype的样式，该是.more的后代。