带你读《2022技术人的百宝黑皮书》——下一代响应式Web设计: 组件驱动式Web设计(28)https://developer.aliyun.com/article/1340865?groupCode=taobaotech
比如,我们可以使用 screen-spanning 这个特性可以用来帮助Web开发人员检测“根视图”是否跨越多个相邻显示区域,并提供有关这些相邻显示区域配置的详细信息。
也可以使用 screen-fold-posture 和 screen-fold-angle 两个媒体查询来对无缝设备进行查询:
还可以使用 horizontal-viewport-segments 和 vertical-viewport-segments 查询视口的数量:
horizontal-viewport-segments 和 vertical-viewport-segments是最新的两个查询特性,它们将替代最初的screen-spanning这个媒体查询特性!
除此之外,还可以通过一些折叠姿势来进行查询:
除了CSS媒体查询之外,还引入了六个新的CSS环境变量,以帮助开发者计算显示区域的几何形状,计算铰链区域 被物理特征遮挡的几何形状:
上图中展示的这六个CSS环境变量将替代以前的 env(fold-top)、env(fold-left)、env(fold-width) 和env (fold-height)。
带你读《2022技术人的百宝黑皮书》——下一代响应式Web设计: 组件驱动式Web设计(30)https://developer.aliyun.com/article/1340863?groupCode=taobaotech