标签页可以对同一页面上对同类信息进行分组展示,可以在有限的显示区域内展示更多信息。
类型
使用详解
基础标签页:
基础标签页整体左对齐,很少会居中对齐,不会右对齐。
通常基础标签页会用于模块的头部,统领下面全部的内容。这时,它是左右通栏的。
基础标签页也可用于模块中间,这时,为了不打乱整个页面的层级,它不是左右通栏的。
基础型:
每个Tab字段长度不太一致,标签页的长度跟随tab字段的长度自适应变化。
定宽型:
有些场景会出现跟随数量的选项。标签页长度选取最长tab字段的长度作为定宽,作用于每个Tab字段。
胶囊标签页:
有两级tab时,无法同时使用基础标签页,通常二级tab将会使用胶囊标签页。
胶囊标签页也常用于需要节约空间的卡片。
胶囊标签页的排版更加灵活,可以根据实际情况灵活变化。
样式
选项型:
基础标签页的选项宽度由选项字段的长短决定,字段不宜超过6个字。
胶囊型:
胶囊型标签页的选项有最小宽度,字段多时,宽度自适应拉伸。选项宽度由最长选项决定,其他选项与最长选项保持一致。
状态及全尺寸: