9.表单

form-control       让文本框宽度为100%，并且还添加了一些其他样式，如文本框变成了圆角，并且点击时边缘发光；btn                改变按钮的样式；form-group         在表单外围添加一层div，并且使表单之间有一个合适的距离；form-inline        form的class属性，让表单在一行显示，当宽度小于768，就不能再一行显示了；form-horizontal    让表单在一行中显示，并且能够改变form-group的样式；control-label      让label里的文字垂直居中对齐；checkbox           checkbox的样式设置；checkbox-inline    让几个checkbox在一行显示；radio-inline       同上；has-success        让文本框显示特别的颜色；用于验证通过或者警告等,下同;has-warninghas-error          字体和文本框的颜色都会发生变化；form-group-lg(sm)  可以改变文本框的高度；      

代码如下：

<div class="container">        <div class="row"><!--        <form action="#" class="form-inline">-->            <form action="#" class="form-horizontal">                <div class="form-group"><!--在有form-inline属性时可以省略掉。-->                    <label for="userName" class="col-lg-1 control-label">用户名:</label>                    <div class="col-lg-6">                        <input type="text" id="userName" class="form-control"/>                    </div>                </div>                <div class="form-group-lg"><!--form-group后再加上lg，可以改变文本框的高度-->                    <label for="password" class="col-lg-1 control-label">密&nbsp;&nbsp;&nbsp;&nbsp;码:</label>                    <div class="col-lg-6">                        <input type="text" id="password" class="form-control"/>                    </div>                </div>                <div class="form-group">                    <div class="col-lg-6 col-lg-offset-1">                        <div class="checkbox">                            <label class="checkbox-inline"><input type="checkbox"/>记住名字</label>                            <label class="checkbox-inline"><input type="checkbox"/>记住密码</label>                            <label class="checkbox-inline"><input type="checkbox"/>自动登录</label>                        </div>                        <div class="radio">                            <label><input type="radio"/>自动登录</label>                        </div>                    </div>                </div>                <div class="form-group">                    <div class="col-lg-1 col-lg-offset-1">                        <input type="button" value="登录" class="btn"/>                    </div>                </div>            </form>        </div>    </div>