Css 为什么我的媒体查询被忽略？

我正在设计一个已经制作好的网站，我在css中输入的最大宽度低于980px的任何@media查询都不会显示在Chrome Inspector中，如果查询的大小通常大于980px，则该查询适用

这不管用

@media screen and (max-width: 979px){
    .custom-home-title-slider {
        color: red;
    }
}

确实如此

@media screen and (max-width: 980px){
    .custom-home-title-slider {
        color: red;
    }
}

---

我知道这是一个相对古老的问题，但我刚刚遇到了我认为是解决办法的问题。您需要添加

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

---

在文档头中。不完全确定原因，但这似乎允许某些浏览器（至少是Chrome浏览器）识别宽度小于980的媒体查询。

当我在此处测试调整结果框而不是浏览器窗口的大小时，两者都可以正常工作。您在css中的何处添加媒体查询？在结尾？我在结尾加上它。他们自己工作，我要问的是我应该寻找什么，这可能会导致我的查询被完全忽略。甚至没有显示在Inspector中并被其他查询覆盖。只是不在那里。但是它在任何大于980px的最大宽度下都能正常工作。您是否检查了HTML中的

元素以确保它没有包含

media=“screen and…”

属性？我检查了，它确实包含css文件，css中的行就在那里。您似乎遗漏了您认为需要添加到文档头的代码。