媒体查询中的最大宽度不起作用

Question

我正在努力让我的网站设计更具响应性。

到目前为止，我有以下规则：

@media screen and (min-width: 1000px) {
    /* styles for screen width 1000px and wider */
}
@media screen and (min-width: 500px)and (max-width: 800px) {
    /* styles for screen width between 500px and 800px */
}

由于某种原因，最后一个媒体查询不起作用。事实上，它完全剥离了页面上每个元素的所有样式。

我一直在四处寻找，我找不到任何关于为什么会这样或者我做错了什么的提示......

我觉得我错过了一个概念或者什么......每个人都在跟我谈论百分比，当我把它带到船上时，我没有看到它与媒体查询的关系如何不应用这种风格规则。

任何人都可以提供任何清晰度吗？

提前致谢！

Answer 1

您没有结束评论标记。

@media screen and (min-width: 1000px) {
    /* styles for screen width 1000px and wider */
}
@media screen and (min-width: 500px)and (max-width: 800px) {
    /* styles for screen width between 500px and 800px */
}

这里没有其他错误。