html - 媒体查询最小界限不起作用

Question

我的 CSS 中有这个查询。最初 width 是 100% 并且当屏幕尺寸在 768 和 1024 像素之间时我希望它是50%。 max-width 似乎起作用了，因为 width 减半了，但是一旦屏幕宽度低于 768 它仍然保持 50%。它不应该恢复到 100% 吗？

@media (max-width: 1023px) and (min-width: 768px)
  .item {
    width: 50%;
}

Answer 1

您缺少几个柯利括号。它应该看起来像...

@media (max-width: 1023px) and (min-width: 768px) {
    .item {
        width: 50%;
    }
}