努力在wordpress下覆盖@media min-width css规则答案

【问题标题】：struggling to override @media min-width css rules under wordpress努力在wordpress下覆盖@media min-width css规则
【发布时间】：2013-04-24 17:36:53
【问题描述】：

我正在尝试使用包含在文档头部的 css 代码覆盖 @media (min-width:#) 规则。

从外部样式表调用的 CSS 规则是

    @media (min-width: 1200px)
       .span9 {
              width: 870px;
              }

那么为什么要插入

    <style type="text/css">

    @media (min-width: 1200px)
       .span9 {
              width: 1100px;
              }
    </style>

进入我的文件的头部根本不做任何事情？当我在 chrome 元素检查器中调整规则时，它就像你想象的那样工作。

我知道后续（较小的）@media (min-width:#) 规则可以优先处理，如果它们最后被处理，但是这不应该包含在页眉的最底部作为最后处理的东西吗？

我非常感谢任何建议，因为我已经搞砸了几个小时并阅读了这方面的内容，但我无法取得任何进展。感谢您的宝贵时间。 :)

【问题讨论】：

如果你看直播页面的源代码是你的样式块在样式表之前还是之后？
嗨！自定义样式块出现在文档头部引用了相关样式表之后。

标签： wordpress media css

【解决方案1】：

尝试将 !important 放入您的 css 属性中，这样排序优先级就不是这样了：

<style type="text/css">

    @media (min-width: 1200px)
       .span9 {
              width: 1100px !important;
              }
</style>

我还没试过。

【讨论】：

【解决方案2】：

愚蠢的可能性 - 您是否尝试在媒体查询中添加括号？

<style type="text/css">

    @media (min-width: 1200px){
       .span9 {
          width: 1100px !important;
        }
    }
</style>

【讨论】：

这是我所缺少的，非常感谢！它立即起作用。您是否有可能快速解释这是如何以不同方式解析的？我以前没有遇到过这种语法。
没有大括号，您的媒体查询就没有上下文。左大括号和右大括号表示满足媒体查询条件时要应用的规则的开始和结束。没有它们，您的外部样式表将优先