css - 在最小宽度断点中嵌套方向断点
问题描述
我在最小宽度断点(SCSS)中嵌套了一个方向断点,如下所示:
@media only screen and (min-width : 481px) {
@media only screen and (orientation: portrait) {
// something
}
@media only screen and (orientation: landscape) {
// something
}
}
我的问题:宽度条件指的是什么?纵向还是横向?或者它一般是如何工作的?
解决方案
媒体查询的宽度条件总是指当前方向的宽度。因此,当您在智能手机上处于纵向模式时,宽度将是较短的一侧,如果您处于横向模式,宽度条件将指的是较长的一侧。
推荐阅读
- java - 如何使用 spock 为 RESTful Web 服务调用开发模拟服务
- reactjs - 在 JS 对象中使用 redux 数据
- postgresql - POSTGRES JSONB 从嵌套数组中选择值
- python - tf.range() 结果不一致
- python - Python - 使用字典获取数据时出错,因为它仅从 14 个数据中获取 1 个输出。谢谢
- html - 如何在(z-index)固定父级和绝对子级之间放置一个独立的固定Div?
- java - 建议我在 JAVA 中找到最佳编程/代码实践
- python - 读取数据集并将其添加到双引号中
- python - 如何对存储在 S3 存储桶中的文件执行操作?
- web-crawler - 在 Apify-ready 模板中更改 .tld