如何覆盖CSS媒体类？

我为我的项目使用了一些css库。如何覆盖CSS媒体类？

这图书馆此类：

@media only screen and (max-width: 480px) { 
    .nav-tabs>li { 
     margin-bottom:3px; 
    } 
    .nav-tabs>li, 
    .nav-tabs>li>a { 
     display:block !important; 
     float:none !important; 
     border:0 !important; 
     background-color:rgba(0,0,0,0.01); 
    } 
    .nav-tabs>li>a :focus, 
    .nav-tabs>li.active>a { 
     background-color:rgba(0,0,0,0.05); 
    } 
}

当屏幕的尺寸越小则480px的li元件布局被改变。

当屏幕尺寸小于280px（覆盖 - 最大宽度：480px）时，我需要更改默认行为。

我不想改变原有的库文件，所以我贴这个类：

@media only screen and (max-width: 280px) { 
    .nav-tabs>li { 
     margin-bottom:3px; 
    } 
    .nav-tabs>li, 
    .nav-tabs>li>a { 
     display:block !important; 
     float:none !important; 
     border:0 !important; 
     background-color:rgba(0,0,0,0.01); 
    } 
    .nav-tabs>li>a :focus, 
    .nav-tabs>li.active>a { 
     background-color:rgba(0,0,0,0.05); 
    } 
}

我自定义的CSS文件中。

但我仍然得到默认行为，li元素布局仅在屏幕尺寸小于480px时才会更改。

任何想法，为什么我不能覆盖上面的CSS类？

来源

2017-05-29 Michael

我在实际样式中看不到任何区别。 – Blazemonger

@Blazemonger宽度的差异280px而不是480px – Michael

你不用担心屏幕尺寸低于320px：https：//ux.stackexchange.com/questions/74798/are-there-devices-narrower-than-320px-and -data-on-their-usage-for-web-browsing –

我想你想要一些小于280像素的规则和其他280到480之间的规则。对吗？

@media (max-width:480px) and (min-width:281px) { 

}

来源

2017-05-29 14:13:36

感谢post.Where我把这个代码？ – Michael

如何覆盖CSS媒体类？

回答

相关问题