Bootstrap框架中checkbox和radio有點(diǎn)特殊，Bootstrap針對(duì)他們做了一些特殊化處理，主要是checkbox和radio與label標(biāo)簽配合使用會(huì)出現(xiàn)一些小問(wèn)題（最頭痛的是對(duì)齊問(wèn)題）。使用Bootstrap框架，開(kāi)發(fā)人員無(wú)需考慮太多，只需要按照下面的方法使用即可。

<form role="form">
<div class="checkbox">
<label>
<input type="checkbox" value="">
記住密碼
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="optionsRadios" id="optionsRadios1" value="love" checked>
喜歡
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="optionsRadios" id="optionsRadios2" value="hate">
不喜歡
</label>
</div>
</form>

運(yùn)行效果如下或查看右側(cè)結(jié)果窗口（案例1）：

從上面的示例，我們可以得知：
1、不管是checkbox還是radio都使用label包起來(lái)了
2、checkbox連同label標(biāo)簽放置在一個(gè)名為“.checkbox”的容器內(nèi)
3、radio連同label標(biāo)簽放置在一個(gè)名為“.radio”的容器內(nèi)
在Bootstrap框架中，主要借助“.checkbox”和“.radio”樣式，來(lái)處理復(fù)選框、單選按鈕與標(biāo)簽的對(duì)齊方式。源碼請(qǐng)查看bootstrap.css文件第1742行～第1762行：

.radio,
.checkbox {
display: block;
min-height: 20px;
padding-left: 20px;
margin-top: 10px;
margin-bottom: 10px;
}
.radio label,
.checkbox label {
display: inline;
font-weight: normal;
cursor: pointer;
}
.radio input[type="radio"],
.radio-inline input[type="radio"],
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] {
float: left;
margin-left: -20px;
}
.radio + .radio,
.checkbox + .checkbox {
margin-top: -5px;
}