css - 编辑后的 ​​CSS 不会覆盖原始主题 CSS

Question

我正在向 wordpress 主题 (www.ronanmart.in) 添加自定义 CSS 以获得我想要的效果。

对于主页上的 .hero-inner div，我正在尝试编辑填充，但它似乎一直默认为主题设置。我编辑的任何其他内容都覆盖了主题 CSS。

原始填充:

padding: 121px 2em;

新填充:

padding: 261px 2em 0 2em;

有什么我想念的吗？

Answer 1

确保您编写了更具体的 CSS 规则:

Specificity is the means by which browsers decide which CSS property values are the most relevant to an element and, therefore, will be applied. Specificity is based on the matching rules which are composed of different sorts of CSS selectors.
source: https://developer.mozilla.org/en/docs/Web/CSS/Specificity

要进行快速测试，您可以先使用 !important 来查看规则是否匹配。如果元素的样式符合预期您应该删除 !important 并尝试编写更具体的规则。

.class-name {
    padding: 261px 2em 0 2em !important;
}

/* the same rule, more specific */
div .parent-class .class-name {
    padding: 261px 2em 0 2em;
}

Note: You should avoid using !important!