html – 媒体查询取消其他媒体查询

概述我很困惑,因为如果宽度小于748px,应该隐藏徽标.但是,宽度低于960px的所有尺寸都会显示徽标. 我在这里想念的是什么？ (在屏幕截图中)我看到max-width：768px媒体查询在max-width：960px之前声明,这是不正确的.仅使用max-width的媒体查询应按降序排序.我们假设您按此顺序声明媒体查询： >(最大宽度：768px) >(最大宽度：960px) 如果您的屏幕宽度为4 我很困惑,因为如果宽度小于748px,应该隐藏徽标.但是,宽度低于960px的所有尺寸都会显示徽标.

我在这里想念的是什么？

解决方法 (在屏幕截图中)我看到max-wIDth：768px媒体查询在max-wIDth：960px之前声明,这是不正确的.仅使用max-wIDth的媒体查询应按降序排序.我们假设您按此顺序声明媒体查询：

>(最大宽度：768px)
>(最大宽度：960px)

如果您的屏幕宽度为400px,则两个媒体查询都将符合条件.在这种情况下,稍后声明的媒体查询块获胜.

解：

按最大宽度规则降序排序(首先是较大的宽度).

或者使用互斥的媒体查询块,例如：

>(最小宽度：961px)
>(最小宽度：769px)和(最大宽度：960px)
>(最大宽度：768px)

在这种情况下,顺序无关紧要.

总结

以上是内存溢出为你收集整理的html – 媒体查询取消其他媒体查询全部内容，希望文章能够帮你解决html – 媒体查询取消其他媒体查询所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。