Html 媒体查询断点不准确

我正在为一个页面创建媒体查询，但在让它们恰好在媒体查询中指定的点中断时遇到问题

例如，我有：

@media all and (max-width:1000px) {
    header nav ul.nav_items li a {
        padding:15px 10px 15px;        
    }
}

但当我使用Chrome并打开开发工具，观察浏览器的视口/宽度时，CSS规则在1226px左右生效。为什么CSS规则不能精确应用于1000px

---

下面是我的HTML/CSS的一个JSFIDLE:

通过将媒体查询移动到CSS文件的末尾，您将使其覆盖设置的值。事物出现得越晚（而且越具体），它收到的偏好就越多。由于您的查询位于文件的开头，因此不会应用以后对标题导航的显示属性所做的任何更改。请注意，媒体查询不会增加特异性或得到任何特殊处理，它们只是被忽略，直到它们在定义的范围内

因此，您的文件后面可能有一个最大宽度为1000px的片段。因为它在900px之后出现，但屏幕大小使两者都有效，所以1000px生效

---

我有一个修改的片段，但因为您发布了整个HTML和CSS，所以在这里发布太长了。相信我，如果你把它移到最后，它会起作用的

326px

区别绝对不是“不准确”。这里有东西坏了。我可能猜你有更多的媒体查询和错误的

minwidth

max width

设置

检查实际情况的最佳方法是：

Firefox-点击F12（或在Mac上打开开发工具）

转到“开发工具”顶栏中的“样式编辑器”

右侧列显示@media规则列表（断点）

---

祝您调试愉快并好运

标题中有meta view端口标记吗？是的，我有这个标记：

@media all和（最大宽度：900px）

？我们必须看到它不工作。演示或链接会很有用。只需使用jsfiddle@Tony54是不是因为他们的答案是用应该在评论中的问题来表达的。。。？我不会小看这件事，你想干什么就干什么，但我相信其他答案并不能解释任何事情。但那只是我：）