为什么.class元素{}不覆盖元素{}？

Question

我想覆盖样式

我尝试了不同的代码。我删除了缓存，并停止创建从CDN发送来的静态CSS文件。

.page-special article {
    background: none;
    padding-bottom: 0;
}

.hentry .page-special {
    margin: 0;
}

我希望背景图片，内边距和边距能被擦除，但它们仍会出现。样式表是：

article {
    background: url(images/break.png) bottom center no-repeat;
    padding-bottom: 2em;
}
.hentry {
    margin: 0 0 4em;
}

Answer 1

第一个声明是找到'.page-special的子'articka：

.page-special article {
        background: none;
        padding-bottom: 0;
    }

第二个是找到.hentry的子类.page-special：

.hentry .page-special {
    margin: 0;
}

然后，您正在寻找所有属于本文的DOM元素，并采用以下样式：

article {
    background: url(images/break.png) bottom center no-repeat;
    padding-bottom: 2em;
}

然后，您要向.hentry类声明样式，但在为其子类.page-special声明样式之前。

.hentry {
    margin: 0 0 4em;
}

简而言之，您的CSS声明的第一部分指向.hentry的子级，即.page-special。然后将其应用于父级。这就是为什么您不能“覆盖”样式的原因。 我希望这会有所帮助。

Answer 2

如果用html选择类“ .page-special”不起作用，则将ID添加到样式表中的代码中。例如：

#id.hentry {
    margin: 0;
}