Group Button按钮组
按钮组是tab头的一种形式,已经被集成在Tab组件模块使用;因其由css+html打造,当然也可以用在网页body部分的任何地方,也可以被其他自定义组件或模块打包引用。
简单使用
将多个ax-btn
按钮组件使用_group-btn
元素包裹即可。
- 输出
- HTML
-
wrap为SPAN标签
读书 看报 玩手机 旅行 wrap为A标签
读书 看报 玩手机 旅行 -
状态
分组按钮有三种状态:regular
常规、selected
选中和disabled
禁用。
disabled
是按钮自身就有的属性,selected
是分组按钮下的特有属性。
- 输出
- HTML
-
wrap为SPAN标签
读书 看报 玩手机 旅行 wrap为A标签
读书 看报 玩手机 旅行 -
彩色按钮
可以对ax-btn标签使用theme
属性,以创建多色按钮组。
- 输出
- HTML
-
单色
读书 看报 玩手机 旅行 多色
读书 看报 玩手机 旅行 -
分割线
如果对ax-btn标签使用theme
属性,会导致背景色连成一片,所以可以对_group-btn追加separated
属性以实现按钮分割线效果。
- 输出
- HTML
-
读书 看报 玩手机 旅行 -
自定义圆角
按钮组的首尾按钮均有圆角,该圆角可通过按钮组css中的--_radius-btn
变量来定义。
- 输出
- HTML
-
读书 看报 玩手机 旅行 -