select
类是一个简单的对 HTML 元素 <select>
的包裹——提供更具有弹性和图标支持的样式支持。
多项选择
#
您可以通过使用修饰符 is-multiple
和利用 HTML 属性 multiple
使其成为多项选择的下拉菜单。
颜色
#
示例
HTML
示例
HTML
示例
HTML
示例
HTML
示例
HTML
示例
HTML
样式
#
您可以使用 is-rounded
修饰符创建圆角下拉菜单:
型号
#
示例
HTML
示例
HTML
示例
HTML
示例
HTML
状态
#
Bulma 为 select
元素设置了不同的状态。每个状态通过伪类和 CSS 类设定:
-
:hover
和 is-hovered
-
:focus
和 is-focused
-
:active
和 is-active
这就可以使您不必触发它而获得特定状态。
普通
悬停
聚焦
加载中
使用图标
#
您可以在一个控件上附加修饰符:
还需要在图标上添加修饰符:
-
因为用了
has-icons-left
所以要用 icon is-left
select 的型号也会直接定义图标容器的型号。
如果控件包含图标,不论输入框的型号大小或者图标的型号大小,Bulma 都会确保图标居中。