为什么.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;
}