Skip to content

分隔线

属性 ​

属性类型默认值说明
orientation'horizontal' | 'vertical''horizontal'分隔线的方向,垂直分隔线适合放在固定高度的行内。
labelstring—显示在分隔线中间的文字,同时作为分隔线的无障碍名称。
variant'subtle' | 'strong''subtle'线条的视觉强弱,strong 使用强调边框色,适合需要明显边界的场景。
isFullBleedbooleanfalse为 true 时,分隔线会越过容器内边距,延伸到容器边缘。

插槽 ​

  • label:分隔线中间的富文本内容,会替代 label 属性的纯文字。

主题 ​

css
.my-divider {
  --astryx-divider-color-subtle: #00000014;
}
  • --astryx-divider-color-subtle:subtle 线条颜色。
  • --astryx-divider-color-strong:strong 线条颜色。
  • --astryx-divider-label-color:文字颜色。
  • --astryx-border-width:线条粗细。