覆盖CSS媒体查询(Override CSS media queries)

2019-06-26 04:48发布

我与使用CSS媒体查询我不喜欢每天页面工作; 我宁愿使用完整的页面(其中大部分都涉及到Twitter的引导菜单倒塌时超过768px窄)。

有没有办法重写引导的媒体查询与CSS? 最好不定义我自己的媒体查询来独立地覆盖所有的规则,因为我觉得这样会花费相当长的时间。

编辑:我没有源代码的控制,否则我会杀了引导响应代码。

Answer 1:

你为什么不删除它们摆在首位?

如果你不能,你仍然可以覆盖与规则CSS声明:

  • 具有相同的优先选择,并提出了MQ块之后
  • 这比MQ块的规则具有更高的优先级选择
  • !important的价值和分号之间
    /* one id, one class AND one element => higher priority */
    #id element.class { property: value2; }

    /* !important will nuke priorities. Same side effects as a nuke,
       don't do that at home except if you've tried other methods */
    #id .class { property: value2 !important; }

    @media(blah) {
      /* Overridden. Thrice. */
      #id .class { property: value1; }
    }

    /* same selector, same everything except it comes after the one in @media?
       Then the latter is applied.
       Being in a @media doesn't give any more priority (but it won't be applied
       everywhere, depending on "blah", that's the point of MQ) */
    #id .class { property: value2; }

在前面的例子中,任何外部的声明的@media块将覆盖一个内,例如有3个原因值2将被应用,而不是VALUE1。



Answer 2:

想覆盖白手起家responsive.css了。

我有网站,我想使用默认responsive.css而对于另一半一个媒体查询导致错误的布局,所以我想删除它的一半。

根据我的研究CSS不允许删除媒体查询

所以,我会去复制responsive.css并取出媒体查询。 如果你有到源没有接入,覆盖可能是唯一的选择。



文章来源: Override CSS media queries