菜单

按钮
按钮表示一个可能的用户操作

下载

类型

虽然任何标签都可以用作按钮,但只有使用 `<button>` 标签或添加属性 `tabindex="0"` 时,它才具有 键盘可聚焦性。键盘可访问的按钮将在点击后保留焦点样式,这在视觉上可能令人感到突兀。

可聚焦

强调

按钮可以格式化为显示不同级别的强调

将您的品牌颜色设置为 site.variables 中的 primary 和 secondary 颜色变量,将允许您使用您的颜色主题为 UI 元素着色

动画

按钮可以动画显示隐藏内容

按钮将根据可见内容大小自动调整大小。确保有足够的空间显示隐藏内容
下一步
注册 Pro 帐户

带标签

按钮可以与 标签 一起出现

喜欢
2,048
2,048
喜欢
喜欢
1,048
分叉
1,048

图标

按钮可以只有图标

带标签的图标

按钮可以使用图标作为标签

基础

基础按钮不太突出

反转

按钮可以格式化以显示在深色背景上

按钮

按钮可以作为一个组存在

图标按钮

按钮组可以显示一组图标

内容

条件语句

按钮组可以包含条件语句

或者按钮可以将它们的文本本地化,或者使用 `data-text` 属性进行调整。如果条件语句的大小发生变化,您需要调整 `@orCircleSize`

状态

活动

按钮可以显示它当前是活动的用户的选择

禁用

按钮可以显示它当前无法交互

加载中

按钮可以显示加载指示器

变体

社交

按钮可以格式化以链接到社交网站

尺寸

按钮可以具有不同的尺寸

浮动

按钮可以与其容器的左侧或右侧对齐

彩色

按钮可以具有不同的颜色

紧凑

按钮可以减少其填充以适应更紧凑的空间

切换

按钮可以格式化为打开和关闭

积极

按钮可以暗示一个积极的结果

消极

按钮可以暗示一个消极的结果

流体

按钮可以占据其容器的宽度

圆形

按钮可以是圆形的

垂直附加

按钮可以附加到其他内容的顶部或底部

顶部
底部

水平附加

按钮可以附加到其他内容的左侧或右侧

组变体

垂直按钮

组可以格式化为垂直显示

图标按钮

组可以格式化为图标

带标签的图标按钮

组可以格式化为带标签的图标

混合组

组可以格式化为将多种按钮类型组合在一起

等宽

组可以均匀地划分它们的宽度

彩色按钮

组可以具有共享颜色

基础按钮

按钮组可以不太突出

组尺寸

组可以具有共享尺寸

调光器消息
调光器子标题