如何使用媒体查询选择特定视口
我正在尝试选择 767px 和 1024px 之间的区域。
我希望将其应用于屏幕、iPad 纵向，但不适用于 iPad 横向。
这些是我尝试过但没有成功的一些查询。
@media only 屏幕和（最大设备宽度：1024px）和（方向：纵向），
screen and (min-width: 767px) and (max-width: 1024px) { ... }
问题出在 iPad 横向落在 767 和 1024 的查询范围内，所以我不知道如何排除iPad 横向特定视口。
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
怎么样：
那么就这样做：
所以
我不确定你的意思...那些人就是这么做的。无论哪种方式，这里都有另一个解决方案，因此您可以排除 iPad Landscape /* iPads (landscape) ----------- /
@仅媒体屏幕
和（最小设备宽度：768px）
和（最大设备宽度：1024px）
和（方向：横向）{
/ 样式 */
}
/* iPad（纵向） ----------- /
@仅媒体屏幕
和（最小设备宽度：768px）
和（最大设备宽度：1024px）
和（方向：纵向）{
/ 样式 */
}
how about:
so then do this:
so <style @media screen (max-device-width: 1024px) and (orientation:portrait){ /** portrait / } @media screen (max-device-width: 1024px) and (orientation:landscape){ / landscape **/ } </style>
i'm not sure what you mean...those do that. either way, here's another solution so you can exclude iPad Landscape /* iPads (landscape) ----------- /
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
/ Styles */
}
/* iPads (portrait) ----------- /
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
/ Styles */
}