mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-28 13:09:40 +08:00
Code Issues Actions 50 Packages Projects Releases Wiki Activity

mv input-size.md to input.md, inputs.md to input-group.md

Browse Source
This commit is contained in:
SimaQ 2015-10-29 08:43:56 +08:00
parent 27a8d10f3c
commit bc228af808
2 changed files with 0 additions and 128 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
components/form/demo/input-size.md
View File

@ -1,34 +0,0 @@
# Input 尺寸
- order: 6
我们为 `<input />` 输入框定义了三种尺寸（大、默认、小）。
css 样式引用： 定义 `.ant-input` 类的基础上加上 `.ant-input-lg .ant-input-sm` 即可。
`<Form.Input />` 组件引用需要声明 `site` 属性即可，属性值为 ['small', 'default', 'large']。
注意： 在 `<form>` 表单里面，我们只使用**大尺寸**， 即高度为 **32px**，作为唯一的尺寸。
---
````jsx
var Form = antd.Form;
ReactDOM.render(
<div className="row">
<Form.InputGroup>
<div className="col-6">
<Form.Input type="text" id="largeInput" size="large" placeholder="大尺寸" />
</div>
<div className="col-6">
<Form.Input type="text" id="defaultInput" placeholder="默认尺寸" />
</div>
<div className="col-6">
<Form.Input type="text" id="smallInput" placeholder="小尺寸" size="small" />
</div>
</Form.InputGroup>
</div>
, document.getElementById('components-form-demo-input-size'));
````

94
components/form/demo/inputs.md
View File

@ -1,94 +0,0 @@
# Input 输入框集合
- order: 5
---
````jsx
var Form = antd.Form;
var Select = antd.Select;
var Option = Select.Option;
ReactDOM.render(
<Form horizontal>
<Form.Item
label="标签输入框："
labelClassName="col-6"
wrapperClassName="col-16">
<Form.Input type="text" addonBefore="Http://" value="mysite.com" id="site1"/>
</Form.Item>
<Form.Item
label="标签输入框："
labelClassName="col-6"
wrapperClassName="col-16">
<Form.Input type="text" addonBefore="Http://" addonAfter=".com" value="mysite" id="site2"/>
</Form.Item>
<Form.Item
label="select 标签输入框："
labelClassName="col-6"
wrapperClassName="col-16">
<Form.InputGroup>
<Form.Input type="text" id="site4" placeholder="www.mysite" />
<div className="ant-input-group-wrap">
<Select defaultValue=".com" style={{width:70}}>
<Option value=".com">.com</Option>
<Option value=".jp">.jp</Option>
<Option value=".cn">.cn</Option>
<Option value=".org">.org</Option>
</Select>
</div>
</Form.InputGroup>
</Form.Item>
<Form.Item
label="输入身份证："
labelClassName="col-6"
wrapperClassName="col-16">
<Form.InputGroup>
<div className="col-6">
<Form.Input type="text" id="certNo1" />
</div>
<div className="col-6">
<Form.Input type="text" id="certNo2" />
</div>
<div className="col-6">
<Form.Input type="text" id="certNo3" />
</div>
<div className="col-6">
<Form.Input type="text" id="certNo4" />
</div>
</Form.InputGroup>
</Form.Item>
<Form.Item
label="电话号码："
labelClassName="col-6"
wrapperClassName="col-16">
<div className="row">
<div className="col-4">
<Form.Input type="text" id="tel1" value="086" />
</div>
<div className="col-2">
<p className="ant-form-split">--</p>
</div>
<div className="col-18">
<Form.InputGroup type="group">
<div className="col-8">
<Form.Input type="text" id="tel1" />
</div>
<div className="col-8">
<Form.Input type="text" id="tel2" />
</div>
<div className="col-8">
<Form.Input type="text" id="tel3" />
</div>
</Form.InputGroup>
</div>
</div>
</Form.Item>
</Form>
, document.getElementById('components-form-demo-inputs'));
````