单独的表单控件会被自动赋予一些全局样式。所有设置了 .form-control
类的 <input>
、<textarea>
和 <select>
元素都将被默认设置宽度属性为 100%;
。 将 label
元素和前面提到的控件包裹在 .form-group
中可以获得最好的排列。
<div class="container"> <div class="row"> <form action=""> <div class="from-group"> <label for="" class="from-control">用户名:</label> <input type="text" class="form-control"> </div> <div div class="from-group"> <label for="" class="from-control">密码:</label> <input type="password" name="" id="" class="form-control"> </div> </form> </div> </div>
内联表单样式
<div class="container"> <div class="row"> <form action="" class="form-inline"> <div class="form-group"> <label for="">用户名:</label> <input type="text" class="form-control"> </div> <div class="form-group"> <label for="" >密码:</label> <input type="password" class="form-control"> </div> </form> </div> </div>