mirror of
https://github.com/ant-design/ant-design.git
synced 2024-11-25 11:40:04 +08:00
update form page
This commit is contained in:
parent
c4cd3ce495
commit
ef9ad70aea
@ -4,10 +4,12 @@
|
||||
|
||||
表单基本实例
|
||||
|
||||
`.ant-input` 类为 `<input>`、`<textarea>`、`<select>` 元素默认设置了 `width: 100%`。
|
||||
表单一定会包含表单域,表单域包含了一个标签和一个输入控件,这里我们用类 `.ant-form-item` 表示。
|
||||
|
||||
为了获得更好的排列,请将 label 元素和 `<input>`、`<textarea>`、`<select>` 控件包裹在 `.ant-form-item` 中。
|
||||
|
||||
`注`:`.ant-input` 类为 `<input>`、`<textarea>`、`<select>` 元素默认设置了 `width: 100%`。
|
||||
|
||||
---
|
||||
|
||||
````html
|
||||
|
@ -6,13 +6,15 @@
|
||||
|
||||
展示所有支持的表单控件。
|
||||
|
||||
1. 输入框:只有正确设置了 type 属性的输入控件才能被赋予正确的样式。
|
||||
`注`: 输入框:只有正确设置了 type 属性的输入控件才能被赋予正确的样式。
|
||||
|
||||
---
|
||||
|
||||
````html
|
||||
<h4>input 输入框</h4>
|
||||
<!-- text input -->
|
||||
<input type="text" class="ant-input" placeholder="Please enter...">
|
||||
<!-- password input -->
|
||||
<input type="password" class="ant-input" value="123456">
|
||||
|
||||
<h4>textarea 文本域</h4>
|
||||
@ -84,4 +86,11 @@
|
||||
<label class="ant-radio-inline">
|
||||
<input type="radio" name="inlineRadios" id="inlineRadio3" value="option3"> 3
|
||||
</label>
|
||||
|
||||
<h4>文件输入框</h4>
|
||||
<div class="ant-form-item">
|
||||
<label for="InputFile">File input</label>
|
||||
<input type="file" id="InputFile">
|
||||
<p class="ant-form-explain">Choose a file...</p>
|
||||
</div>
|
||||
````
|
||||
|
@ -4,7 +4,7 @@
|
||||
|
||||
水平排列的表单
|
||||
|
||||
为 `<form>` 标签添加 `.ant-form-horizontal` 类(这让 `.ant-form-item` 表现为栅格系统中的 row),并结合使用我们提供的 [栅格系统](http://ant.design/components/layout/),可以实现 label 标签和表单控件的水平并排排列。
|
||||
为 `<form>` 标签添加 `.ant-form-horizontal` 类(这让 `.ant-form-item` 表现为栅格系统中的 `row`),并结合使用我们提供的 [栅格系统](http://ant.design/components/layout/),可以实现 label 标签和表单控件的水平排列。
|
||||
|
||||
---
|
||||
|
||||
|
@ -6,6 +6,4 @@
|
||||
|
||||
---
|
||||
|
||||
## 如何使用
|
||||
|
||||
孵化中,待完善......
|
||||
表单是用来接受用户各种输入的控件(元素)。
|
||||
|
Loading…
Reference in New Issue
Block a user