排版-表单

最新推荐文章于 2024-11-08 00:00:00 发布

转载最新推荐文章于 2024-11-08 00:00:00 发布 · 176 阅读

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/xiaowie/p/10688922.html

单独的表单控件会被自动赋予一些全局样式。所有设置了 .form-control 类的 <input>、<textarea> 和 <select> 元素都将被默认设置宽度属性为 width: 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>

转载于:https://www.cnblogs.com/xiaowie/p/10688922.html