使用 OR 逻辑组合 CSS 媒体查询中的多个条件
在 CSS 媒体查询中,使用“OR”逻辑指定多个条件可能很有用用于定位具有不同屏幕尺寸或方面的设备。虽然问题中提供的代码不正确,但有一个简单的方法可以实现所需的结果。
要使用“OR”逻辑指定多个条件,请用逗号分隔:
@media screen and (max-width: 995px), screen and (max-height: 700px) { ... }
如 https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries 的文档中所述:
"逗号用于组合多个逗号分隔列表中的每个查询都与其他查询分开处理,因此,如果列表中的任何查询为 true,则整个媒体语句将返回 true。换句话说,列表的行为类似于逻辑或运算符。”
使用这种方法,媒体查询会检查屏幕宽度是否小于或等于 995 像素,或者屏幕高度是否小于或等于 700像素。如果满足任一条件,将应用媒体查询中指定的样式。
免责声明: 提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发到邮箱:[email protected] 我们会第一时间内为您处理。
Copyright© 2022 湘ICP备2022001581号-3