Css 正确的媒体查询语法

当我写这条规则的时候

header
{
    margin-bottom: 100px;
}

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

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

问题出现在以下网站上：

---

如果您检查样式表，您将看到一堆不起作用的媒体查询。这对我来说是一个很大的迷雾，因为他们过去是。

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

@media only screen and () {}

---

请参阅此JSBin演示中的“好”和“坏”媒体查询：

尝试用

屏幕替换
all
，结果是在“和”和括号之间需要一个空格。这似乎是一个实际的解决方案，当缺少空格时，会显示“解析错误”。在我看来，允许省略空格（语法有
S*
，这意味着任意数量的空白，包括零），但显然浏览器和CSS验证器的限制性更强