如何在媒体查询中使用 \> 或 <（大于和小于）符号

Question

我们可以在媒体查询中使用“>”或“<”符号（大于和小于）吗？例如，我想隐藏所有小于 768 像素的显示器的潜水。我可以这样说吗：

 @media screen and (min-width<=768px) {}

原文由 user1986096 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

媒体查询不使用这些符号。相反，他们使用 min- 和 max- 前缀。这包含在 规范 中：

• 大多数媒体功能都接受可选的“min-”或“max-”前缀来表示“大于或等于”和“小于或等于”约束。此语法用于避免可能与 HTML 和 XML 冲突的“<”和“>”字符。那些接受前缀的媒体功能最常与前缀一起使用，但也可以单独使用。

因此， (width <= 768px) ，不如说 (max-width: 768px) ：

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

原文由 BoltClock 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

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

原文由 Zack Burt 发布，翻译遵循 CC BY-SA 3.0 许可协议