Question

我有以下媒体查询，它成功地将背景风格应用于身体，但是它不会改变其他人，任何想法都是好的吗？

@media (min-width: 980px) and (max-width: 1200px) {
body {
    background:#F00;
}
.contentsearch.navbar {
    margin-left: -475px !important;
    top: 200px !important;
    width: 950px !important;
}
.contentTabs {
    margin-left: -475px !important;
    width: 948px !important;
}
.ui-tabs-panel { 
    width: 948px !important;
}
}

继承了这些元素的原始css

.contentsearch.navbar { 
     position:absolute; 
     top:200px; 
     width:1170px; 
     left:50%; 
     margin-left:-585px;  
}
.contentTabs {  
border-bottom: 1px solid #AAAAAA;
    border-left: 1px solid #AAAAAA;
    border-right: 1px solid #AAAAAA;
    bottom: 55px;
    height: auto !important;
    left: 50%;
    margin-left: -585px;
    position: absolute !important;
    top: 241px;
    width: 1168px;
 }
.ui-tabs-panel {
    border-bottom: 1px solid #DDDDDD !important;
    border-top: 1px solid #CCCCCC !important;
    bottom: -1px !important;
    height: auto !important;
    overflow: auto;
    position: absolute !important;
    top: 47px !important;
    width: 1168px;
}

Answer 1

试试这个：

    @media all and (min-width: 980px) and (max-width: 1200px){
....
}

您忘了声明您希望它处于活动状态的屏幕类型 @media 全部和.....

你有：

所有
屏幕
打印
手持
TV
等。

You have excellent article for this

Answer 2

没有媒体类型，无论如何都可以。

如果你调整大小浏览器没有任何反应？当屏幕尺寸超过980像素时，应显示原始css，对吗？

Answer 3

我已经解决了这个问题，感谢您的回复。

问题是我是从另一个应用程序复制和粘贴样式，在传输过程中它们似乎已经拾取了某种奇怪的格式/字符，在手工重写之后它现在可以正常工作了！

@media查询不应用某些样式

3 个答案: