Domaple
2014-12-19 15:46
<!doctype html> <html> <head> <meta charset="UTF-8"> <title>表单控件——表单控件大小</title> <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"> </head> <body> <form role="form"> <h3>案例1</h3> <div class="checkbox checkbox-inline"> <label> <input type="checkbox" value=""> 记住密码 </label> </div> <div class="checkbox checkbox-inline"> <label> <input type="checkbox" value=""> 记住密码 </label> </div> <div class="checkbox checkbox-inline"> <label> <input type="checkbox" value=""> 记住密码 </label> </div> <br> <div class="radio radio-inline"> <label> <input type="radio" name="optionsRadios" id="optionsRadios1" value="love" > 喜欢 </label> </div> <div class="radio radio-inline"> <label> <input type="radio" name="optionsRadios" id="optionsRadios2" value="hate"> 不喜欢 </label> </div> <div class="radio radio-inline"> <label> <input type="radio" name="optionsRadios" id="optdionsRadios2" value="hate"> 不喜欢 </label> </div> </form> </body> </html>
老师:为什么显示出来时第一个和后面的对不齐呢?如图:
测试。。。
.checkbox-inline{padding:0;margin:0 15px 0 0; line-height: 20px;min-height: 20px;}
input[type='checkbox'], input[type='radio'] {margin: -2px 5px 0 0;line-height: 20px;}
具体值根据需要调节
好吧,我再看一下节就找到答案了,居然是不要前面那个radio或者checkbox的class就可以了的。
玩转Bootstrap(基础)
314544 学习 · 2275 问题
相似问题