标签页
描述
使用 Tabs 组件，您可以将内容组织成几个部分，用户可以在这些部分之间切换查看。使用选项卡来分组相关部分，并为每个部分提供快速访问。
尺寸
Tabs 可以有三种尺寸：
- M (中等): 此尺寸适用于页面上的常规使用，以及单个部分内部。
- L (大): 如果选项卡也用作页面子标题，请使用 L 尺寸。在这种情况下，选项卡内容是页面上的一个独立部分，而选项卡是该部分的子标题。
- XL (特大): 当选项卡也用作页面标题时，此尺寸是合适的。在这种情况下，当用户切换选项卡时，整个页面的内容都会发生变化。
状态
Tabs 可以具有以下状态：
- Inactive (非活动): 当选项卡未被选中时，它处于非活动状态。在此状态下，选项卡颜色会更淡，以突出显示活动选项卡。
- Active (活动): 此状态分配给选中的选项卡，该选项卡显示当前活动的内容部分。活动选项卡具有更饱和的颜色，并带有下划线以示强调。
- Hover (悬停): 当用户将鼠标悬停在选项卡上时，指针会改变样式，以指示交互的可能性。
- Disabled (禁用): 如果选项卡暂时或永久不可选，则可以禁用它们。此类选项卡会显示为灰色，并且无法进行交互。
属性
您可以为每个选项卡启用/禁用以下元素：
- Icon (图标)。由设计师酌情使用，以可视化选项卡内内容的类型。
- Label (标签)。文本格式的部分名称。
- Counter (计数器)。您可以使用它来指示选项卡内的实体数量。您也可以用它来指定选项卡中出现的新实体数量。
- Label (标签)。您可以使用它来表示选项卡负责的部分的状态。
使用建议
使用选项卡来组织大量内容或将信息划分为逻辑部分。确保选项卡标题具有清晰易读的结构。
选择与您项目整体设计相匹配的选项卡样式和颜色。始终突出显示活动选项卡，以便用户可以轻松识别当前部分。
尽可能尝试使您的 M 和 L 尺寸的选项卡部分能够适应单个屏幕高度。这样，您可以轻松地将内容与选项卡名称关联起来，并看到选项卡内容的结束位置以及下一个区块的开始位置。