wordpress 儿童主题 css 风格被过度使用答案

【问题标题】：wordpress child theme css style gets over riddenwordpress 儿童主题 css 风格被过度使用
【发布时间】：2014-10-06 17:52:48
【问题描述】：

我正在使用带有 swift Ideas 社区主题的 Wordpress，该主题在 swift 和 twitter 引导框架上运行。

为了更改主题的某些样式，我还使用了一个子主题，它现在只有一个 style.css，并且在某些部分上运行良好。但是，我现在想针对不同的屏幕尺寸更改一些引导响应样式，但这是行不通的。

我的问题是，对于不同的屏幕尺寸，母主题的 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 风格总是凌驾于我孩子主题的代码之上。我在哪里做错了？

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

【问题讨论】：

尝试使用 !important 扩展名，如果这不起作用，可能是 wordpress 在某处覆盖了您的文件，您是否将样式表插入到头模块中？
非常感谢，!important 扩展有帮助。有时它可以很容易:)
我也发布了一个答案，如果你能... :) 谢谢
当然，感谢您的帮助！

标签： css wordpress twitter-bootstrap responsive-design parent-child

【解决方案1】：

尝试使用 !important 扩展名，如果这不起作用，可能是 wordpress 在某处覆盖了您的文件，您是否将样式表插入到头模块中？ -

【讨论】：

【解决方案2】：

我遇到了完全相同的问题。 responsive.css 覆盖子主题 css。就我而言，使用 !important 似乎失败了，因为 responsive.css 已经在使用 !important:

// Code from responsive.css
#main-navigation {
  display: none;
  float: none;
  margin: 10px 20px 30px!important;
}

【讨论】：