基础输入框

<input>, <select><textarea>使用.form-control用于一般的外观、聚焦状态、大小的调整。

输入框大小

使用 .form-control-lg.form-control-sm设置高度。

输入框组

在输入框的任一侧放置一个附加项或按钮。你也可以在输入框的两边各放一个。记住将<label>放在输入框组之外。

@
@example.com
https://
$
.00
多行文本

输入框组大小

将相对的表单大小类添加到.input-group本身,其中的内容将自动调整大小,无需在每个元件上重复表单控件大小类。

不支持输入框组单个原件的调整

Small
默认
大号

输入框缀

给输入框添加前缀或后缀。

复选框

复选框的用法

单选框

单选框的用法

开关

开关的用法

Select2

Select2为您提供了一个可定制的选择框,支持搜索、标记、远程数据集、无限滚动和许多其他高度使用的选项。有关更多使用信息,请参阅 Select2

<!-- page css -->
<link href="assets/vendors/select2/select2.css" rel="stylesheet">

<!-- page js -->
<script src="assets/vendors/select2/select2.min.js"></script>

文件浏览器

这个文件选择器是比较糙的,如果你想选择文件的附加功能和获取文件名,需要额外的编写JavaScript。

Bootstrap日期选择插件

Bootstrap提供了一个灵活的日期选择插件。有关更多使用信息,请参阅 bootstrap-datepicker

to
<!-- page css -->
<link href="assets/vendors/bootstrap-datepicker/bootstrap-datepicker.min.css" rel="stylesheet">

<!-- page js -->
<script src="assets/vendors/bootstrap-datepicker/bootstrap-datepicker.min.js"></script>

Quill 编辑器

Quill是一个免费的、开源的富文本编辑器,它是为现代web而构建的。凭借其模块化的架构和富有表现力的API,它可以完全定制以满足任何需要。有关更多使用信息,请参阅 Quill

Hello World!

Some initial bold text


<!-- page js -->
<script src="assets/vendors/quill/quill.min.js"></script>