← 返回 Web 词条WebSplit View需自己实现
分栏视图
Web 原生没有这个
网页没有原生可拖动分栏组件，布局、分隔条键盘操作和最小尺寸都需要自行实现。
通常怎么做：固定分栏用 CSS Grid；可调分栏按 APG Window Splitter 模式实现。
它把相关内容并排放进两个或多个区域，让用户保留上下文并同时查看详情。
- 左边列表右边同时看详情的页面
- 屏幕分成两块各显示一部分内容
- 拖中间分界线能改两边宽度的布局
- 拆分视图
- 主从分栏
- 多窗格布局
结构示意图
其他平台的相似实现
iOS原生支持
Split View本平台没有对应叫法看 iOS 视角 →Android原生支持
List-detail layout本平台没有对应叫法看 Android 视角 →使用规范
什么时候用
- 大屏上列表与详情、主内容与辅助工具需要同时可见并保持关系
什么时候别用
- 手机窄屏、两个区域彼此无关，或每个区域已经复杂到需要独立页面