Bootstrap之:checkbox和radio

Bootstrap框架中checkbox和radio有点特殊,Bootstrap针对他们做了一些特殊化处理,主要是checkbox和radio与label标签配合使用会出现一些小问题(最头痛的是对齐问题)。使用Bootstrap框架,开发人员无需考虑太多,只需要按照下面的方法使用即可
1、不管是checkbox还是radio都使用label包起来了
2、checkbox连同label标签放置在一个名为“.checkbox”的容器内
3、radio连同label标签放置在一个名为“.radio”的容器内
在Bootstrap框架中,主要借助“.checkbox”和“.radio”样式,来处理复选框、单选按钮与标签的对齐方式。

 示例如下:

<div class="checkbox">
    <label>
        <input type="checkbox" name="chk" checked/>
        记住密码
    </label>
</div>
<div class="form-inline">
    <div class="radio">
        <label>
            <input type="radio" name="rd" checked/>
            喜欢        
        </label>
    </div>
    <div class="radio">
        <label>
            <input type="radio" name="rd2" checked/>
            不喜欢        
        </label>
    </div>
</div>

posted @ 2014-12-16 11:13  第九剑  阅读(465)  评论(0)    收藏  举报