修饰器语法(Modifiers syntax)

让我们从一个简单的 button 开始，你只需要添加 "button" CSS 类:

<a class="button">
  Button
</a>

通过添加 "is-primary" CSS 类, 可以修改元素的颜色:

Button

<a class="button is-primary">
  Button
</a>

你可以使用下面的 6 主要颜色之一:

is-primary
is-link
is-info
is-success
is-warning
is-danger

Button

<a class="button is-primary">
  Button
</a>
<a class="button is-link">
  Button
</a>
<a class="button is-info">
  Button
</a>
<a class="button is-success">
  Button
</a>
<a class="button is-warning">
  Button
</a>
<a class="button is-danger">
  Button
</a>

你也可以改变元素的 大小(size):

is-small
is-medium
is-large

Button

<a class="button is-small">
  Button
</a>
<a class="button">
  Button
</a>
<a class="button is-medium">
  Button
</a>
<a class="button is-large">
  Button
</a>

或者修改元素的 样式(style) 或 状态(state):

is-outlined
is-loading
[disabled]

Button

<a class="button is-primary is-outlined">
  Button
</a>
<a class="button is-loading">
  Button
</a>
<a class="button" disabled>
  Button
</a>

最后, 可以非常简答的使用 组合修饰符(modifiers):

Button

<a class="button is-primary is-small" disabled>
  Button
</a>
<a class="button is-info is-loading">
  Button
</a>
<a class="button is-danger is-outlined is-large">
  Button
</a>