如何让我的 CSS 媒体查询正常工作？

Question

我无法让 CSS 媒体查询工作。我过去曾与他们合作过，他们也为我工作过，但在这个特定的网站上，他们不起作用。我添加了

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

，但仍然不起作用。 这是我唯一的 CSS 媒体查询

@media and screen ( max-width: 700px ) {.header-image {display: none;}}

你在某处发现错误了吗？我很确定这将是一件完全微不足道的事情，但我花了几个小时试图让它发挥作用，但到目前为止还没有成功。非常感谢:)

Answer 1

您的代码语法错误

这是有效的媒体查询

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

Answer 2

CSS 媒体查询语法错误 正确的媒体查询语法是 @media screen and (max-width:600px){ /* 屏幕的 CSS 规则 */}