#### 表單小集合
代碼示例：
```
<form class="win-form" action="">
<div class="win-form-item">
<label class="win-form-label">輸入框</label>
<div class="win-input-block">
<input type="text" placeholder="輸入標題" class="win-input" />
</div>
</div>
<div class="win-form-item win-clearfix">
<label class="win-form-label">密碼框</label>
<div class="win-input-inline">
<input type="password" placeholder="輸入密碼" class="win-input" />
</div>
<div class="win-form-mid">輔助說明文字</div>
</div>
<div class="win-form-item">
<label class="win-form-label">選擇框</label>
<div class="win-input-block">
<select>
<option>請選擇</option>
<option>閱讀</option>
<option>音樂</option>
<option>旅行</option>
</select>
</div>
</div>
<div class="win-form-item">
<label class="win-form-label">復選框</label>
<div class="win-input-block">
<input data-title='正常' data-type='checkbox' type="checkbox" name="checkbox">
<input data-title='經過' data-type='checkbox' type="checkbox" name="checkbox">
<input checked="checked" data-title='點擊' data-type='checkbox' type="checkbox" name="checkbox">
</div>
</div>
<div class="win-form-item">
<label class="win-form-label">開關</label>
<div class="win-input-inline" style="width: auto;">
<input type="checkbox" data-type="switch"/>
</div>
<div class="win-input-inline">
<input checked="checked" type="checkbox" data-type="switch"/>
</div>
</div>
<div class="win-form-item">
<label class="win-form-label">單選框</label>
<div class="win-input-block">
<input checked="checked" data-title='男' type="radio" name="sex" value="男" />
<input data-title='女' type="radio" name="sex" value="女" />
</div>
</div>
<div class="win-form-item">
<label class="win-form-label">文本框</label>
<div class="win-input-block">
<textarea placeholder="請輸入內容" class="win-textarea"></textarea>
</div>
</div>
<div class="win-form-item">
<div class="win-input-block">
<button class="win-btn">提交</button>
<button class="win-btn win-btn-primary">重置</button>
</div>
</div>
</form>
```
*****
#### 輸入框
代碼示例：
```
<form class="win-form" action="">
<div class="win-form-item win-clearfix">
<div class="win-input-inline">
<input type="text" placeholder="輸入標題" class="win-input" />
</div>
<div class="win-input-inline">
<input type="text" placeholder="輸入標題" class="win-input win-input-hover" />
</div>
<div class="win-input-inline">
<input type="text" placeholder="輸入標題" class="win-input win-input-click" />
</div>
</div>
</form>
```
*****
####下拉框
代碼示例：
```
<form class="win-form" action="">
<div class="win-form-item win-clearfix">
<div class="win-input-inline">
<select>
<option>請選擇</option>
<option>選項一</option>
<option>選項二</option>
<option>選項三</option>
</select>
</div>
<div class="win-input-inline">
<select data-type="search">
<option>選項</option>
<option>選項二</option>
<option>選項三</option>
<option>選擇一</option>
<option>選擇二</option>
<option>選擇三</option>
<option>你好</option>
<option>您好</option>
<option>hello</option>
</select>
</div>
</div>
</form>
```
*****
#### 復選框
代碼示例：
```
<form class="win-form" action="">
<div class="win-form-item win-clearfix">
<div class="win-input-inline" style="width: auto;">
<input data-title='視覺設計師' data-type='checkbox1' type="checkbox" name="checkbox">
<input data-title='交互設計師' data-type='checkbox1' type="checkbox" name="checkbox">
<input checked="checked" data-title='前端設計師' data-type='checkbox1' type="checkbox" name="checkbox">
</div>
</div>
<div class="win-form-item win-clearfix">
<div class="win-input-inline" style="width: auto;">
<input data-title='蘋果' data-type='checkbox' type="checkbox" name="checkbox">
<input data-title='香蕉' data-type='checkbox' type="checkbox" name="checkbox">
<input checked="checked" data-title='哈密瓜' data-type='checkbox' type="checkbox" name="checkbox">
</div>
</div>
</form>
```
*****
#### 開關
代碼示例：
```
<form class="win-form" action="">
<div class="win-form-item win-clearfix">
<div class="win-input-inline" style="width: auto;">
<input type="checkbox" data-type="switch"/>
</div>
<div class="win-input-inline" style="width: auto;">
<input checked="checked" type="checkbox" data-type="switch"/>
</div>
<div class="win-input-inline" style="width: auto;">
<input data-title='開/關' data-type='switch' type="checkbox" />
</div>
<div class="win-input-inline" style="width: auto;">
<input checked="checked" data-title='開/關' data-type='switch' type="checkbox" />
</div>
<div class="win-inline">
<input data-title='Yes/No' data-type='switch' type="checkbox" />
</div>
<div class="win-inline">
<input checked="checked" data-title='Yes/No' data-type='switch' type="checkbox" />
</div>
</div>
</form>
```
*****
#### 單選框
代碼示例：
```
<form class="win-form" action="">
<div class="win-form-item">
<input data-title='男' type="radio" name="sex" value="男" />
<input checked="checked" data-title='女' type="radio" name="sex" value="女" />
</div>
</form>
```
