Question

我刚刚进入媒体查询，但第一个问题让我发疯，我花了好几个小时。

我试过跟随：

@media screen and (max-device-width: 480px) {
    div.logothingy {
        z-index: 100;
        display:none !important;
    }
}
@media (max-device-width: 480px) {
    div.logothingy {
        z-index: 100;
        display:none !important;
    }
}
@media screen and (max-width: 480px) {
    div.logothingy {
        z-index: 100;
        display:none !important;
    }
}

我将它加载到我的头文件的末尾，当我在firebug中查看它时，它就在那里。

然后我去了一个对象.logoy，当我将窗口尺寸缩小时，它甚至没有得到样式。也就是说它甚至没有得到它然后被覆盖，它根本就没有得到它。疯了。请帮忙。

好的我甚至这样做了：

.logothingy {
border:1px solid;
}
@media screen and (max-width: 480px){
.logothingy {
z-index: 100;
display:none !important;
}
}

并且它正在放置边框而不是其余部分。我头脑中有这个

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

Update2：我将它更改为780px并且它可以正常工作，但是当它处于480px时，它可以在没有造型的情况下一直缩小到任何值。

Answer 1

我有同样的戏剧，并注意到我错过了这个：

<meta name="viewport" content="width=device-width">

在我的索引页面的头部。添加它和媒体查询全部开始。

Answer 2

这是正确的

@media screen and (max-width: 480px){
}

尝试将.logothingy放入内部而不是div.logothingy，让我们知道是否有效

CSS3媒体查询未被提取

2 个答案: