ITCOW牛新网 12月28日消息,WebKit浏览器引擎近期更新开发文档,正式提出CSS Grid Lanes概念,旨在为CSS原生支持瀑布流(Waterfall)布局提供新方案。这一创新基于Mozilla与WebKit的早期合作成果,并经过CSS开发组及主流浏览器厂商的多轮讨论,目前已形成明确的实现路径。新特性将grid-lanes和inline-grid-lanes纳入display属性,系统定义了布局模型及其交互行为。

WebKit引入CSS Grid Lanes

据ITCOW牛新网了解,CSS Grid Lanes在可访问性方面实现重要突破。传统瀑布流布局中,视觉顺序与键盘焦点顺序常存在脱节——例如用户按Tab键导航时,焦点可能先跳至第一列底部,再返回第二列顶部,导致操作体验割裂。为解决该问题,WebKit引入item-tolerance机制,在保持高密度视觉呈现的同时,使键盘导航更符合逻辑流,减少对JavaScript布局计算的依赖。

WebKit引入CSS Grid Lanes
WebKit引入CSS Grid Lanes:原生瀑布流布局登陆Safari技术预览版

W3C协会已针对新特性的兼容性制定降级方案。开发人员可通过先后声明display: grid与display: grid-lanes,确保不支持新特性的浏览器仍以标准网格布局渲染内容,仅垂直方向可能产生额外空白,整体视觉效果仍属可接受范围。目前该功能仍处于测试阶段,相关规范已集成于苹果Safari技术预览版234中,为开发者提供了实验平台。