Framework7 - 表单元素
描述
表单元素用于制作美观的表单布局。
Framework7 提供了一些表单元素，如下表所示 −
| S.No | 表单元素 | 结构 |
|---|---|---|
| 1 | 所有文本输入 |
<div class = "item-input"> <input type = "password"> </div> |
| 2 | Select |
<div class = "item-input"> <select>...</select"> </div> |
| 3 | Textarea |
<div class = "item-input"> <textarea></textarea> </div> |
| 4 | Resizable Textarea |
<div class = "item-input"> <textarea class = "resizable"></textarea> </div> |
| 5 | Switch (Checkbox) |
<label class = "label-switch"> <input type = "checkbox"> <div class = "checkbox"></div> </label> |
| 6 | Slider (Range input) |
<div class = "item-input">
<div class = "range-slider">
<input type = "range" min = "10" max = "50"
step = "0.1">
</div>
</div>
|
我们可以使用下表中指定的各种类型的表单元素 −
| S.No | 表单元素类型 &描述 |
|---|---|
| 1 | 完整布局
完整布局类型用于显示整个表单元素。 |
| 2 | 图标和输入
您可以在表单布局中将图标与输入字段一起使用。 |
| 3 | 标签和输入
您可以在表单中将标签与输入字段一起使用布局。 |
| 4 | 仅输入
Framework7 允许您仅将输入字段与表单元素一起使用。 |
| 5 | 插入
您可以使用 inset 类使表单元素插入。 |
framework7_forms.html
