css - wordpress child 主题 css 风格被超越了

Question

我正在使用带有 swift ideas neighborhood 主题的 Wordpress，它在 swift 和 twitter bootstrap 框架上运行。

为了更改主题的某些样式，我还使用了一个子主题，它现在只有一个 style.css 并且在某些部分工作正常。但是，我现在想针对不同的屏幕尺寸更改一些 Bootstrap 响应样式，但这不起作用。

我的问题是，母主题的 responsive.css 总是覆盖不同屏幕尺寸的子主题的样式。

在这里，我将向您展示我想要更改的内容。首先，我像这样加载我母亲主题的两个不同的 .css 文件

@import url("../neighborhood/style.css");
@import url("../neighborhood/css/responsive.css");

接下来，这是我要更改的母亲主题的样式:

@media only screen and (min-width: 1200px) {
(...)
body.woocommerce .has-no-sidebar ul.products li.product, body.woocommerce .has-no-sidebar .upsells.products ul.products li.product {
      width: 270px;
}
(...)
}

在我的子主题 style.css 中，我将这一行更改为:

@media only screen and (min-width: 1200px) {
    body.woocommerce .has-no-sidebar ul.products li.product, body.woocommerce .has-no-sidebar .upsells.products ul.products li.product {
        width: 31%;
    }
}

对我来说，这看起来不错，但我母亲主题的 responsive.css 的样式总是覆盖我的子主题的代码。我哪里弄错了？

提前致谢，非常感谢您的帮助!

Answer 1

尝试使用 !important 扩展名，如果这不起作用，也许 wordpress 正在某处覆盖您的文件，您是否将样式表插入到标题模块中？ –