一篇文章我們說了單行文本框和多行文本框，今天呢我們繼續看一下表單的其它控件：單選框、復選框、下拉框。

（1）單選框和復選框

在我們表單頁面中，經常會有選擇性別或者選擇愛好這類的內容，使用選擇框是一個好主意，html中有兩種選擇框，即單選框和復選框，兩者的區別是單選框中的選項用戶只能選擇一項，而復選框中用戶可以任意選擇多項，甚至全選。

使用語法：

單選框：<input type="radio" value="值" name="名稱" checked="checked"/>

復選框：<input type="checkbox" value="值" name="名稱" checked="checked"/>

詳細講解：

1、type: 當 type="radio" 時，控件為單選框；當 type="checkbox" 時，控件為復選框

2、value：提交數據到服務器的值（后臺程序使用）

3、name：為控件命名，這里要注意同一組的單選按鈕，name 取值一定要一致（具體可見下邊的參考練習）。

4、checked：當設置 checked="checked"（也可以直接簡寫成checked） 時，該選項被默認選中

使用練習：

我們創建一個表單，表單里邊包含姓別（男、女）選擇的單選框，默認選中男以及愛好（唱歌、打游戲、繪畫、旅游）選擇的多選框，默認選中唱歌。具體的代碼如下圖所示：

在網頁中的顯示效果就如下圖所示：

（2）下拉框

下拉框也是我們常用的一個表單控件，多用于選擇城市地區等。

使用語法：

<select>

<option value="向服務器提交的內容" selected="selected">網頁顯示的內容</option>

</select>

詳細講解：

1、option：option為select下拉子元素，可以有一個或多個，寫法類似ul和li，其中的value內容為提交數據到服務器的值（后臺程序使用）

2、selected：當設置 selected="selected"（也可以直接簡寫成selected） 時，該選項被默認選中

使用練習：

我們創建一個表單，表單里邊包含一個城市的下拉框，下拉框中有北京、上海、天津這三個城市，其中默認選中天津。具體的代碼如下圖所示：

在網頁中的顯示效果就如下圖所示：

好了，本篇文章就先給大家介紹這幾個表單控件的語法以及使用，下篇文章我們將介紹按鈕的語法及使用以及完整的表單練習演示，記得平時要多加練習才是王道。

每日金句：做人要像竹子一樣每前進一步，都要做一次小結。喜歡我的文章的小伙伴記得關注一下哦，每天將為你更新最新知識。

多選框（checkbox）用于可多選的情況，單選框（radio）則只能選擇一個。在普通的HTML中，checkbox、radio在和<label>等標簽配合時會出現對齊的問題，Bootstrap很好地解決了這個問題，代碼如下：

單選框和多多選框效果圖

實現代碼

上面的代碼中我們將input標簽都包含在了label中，強制其在一行，但是很多情況下我們不建議這么做。一般一個<label>中包含一個元素，如果遇到多個<label>標簽則會垂直顯示內容。Bootstrap中提供了幾個樣式類，如class="checkbox-inline"、class="radio-inline"，可以使checkbox和radio顯示在一行，代碼如下：