css - 媒体查询的正确语法

Question

当我写下这条规则

header
{
    margin-bottom: 100px;
}

一切都很好。但是如果我将它包装在媒体查询中，它就会停止工作。

@media all and(max-width: 5000px)
{
    header
    {
        margin-bottom: 100px;
    }
}

问题出现在以下网站：link

如果您检查样式表，您会看到一堆不起作用的媒体查询。对我来说这是一个很大的谜团，因为他们曾经这样做过。

Answer 1

我在您的 CSS 中查看了媒体查询。看起来您需要在单词“and”和左括号之间留一个空格。

@media only screen and () {}

在这个 JSBin 演示中查看好的和坏的媒体查询：http: //jsbin.com/ALiHAFu/1/edit