<div class="container">  <form action="#" method="post">    <fieldset>      <legend>用戶登陸</legend>      <div class="form-group">        <label>用戶名：</label>        <input type="text" class="form-control" name="name" placeholder="用戶名">      </div>      <div class="form-group">        <label>密碼：</label>        <input type="password" class="form-control" name="pwd" placeholder="密碼">        <!--form-control代表的是占滿容器-->      </div>      <div class="checkbox">        <label><input type="checkbox">記住密碼</label>      </div>      <!--多選框必須這么寫(xiě) 不然會(huì)造成選框與文本重疊的問(wèn)題-->      <div class="form-group">        <button type="submit" class="btn btn-default">提交</button>      </div>    </fieldset>  </form></div>

<div class="container">  <form action="#" method="post" class="form-inline">    <!--form-inline讓表單橫向放置-->    <fieldset>      <legend>用戶登陸</legend>      <div class="form-group">        <label class="sr-only">用戶名：</label>        <!--sr-only讓label隱藏-->        <input type="text" class="form-control" name="name" placeholder="用戶名">      </div>      <div class="form-group">        <label>密碼：</label>        <input type="password" class="form-control" name="pwd" placeholder="密碼">        <!--form-control代表的是占滿容器-->      </div>      <div class="checkbox">        <label><input type="checkbox">記住密碼</label>      </div>      <!--多選框必須這么寫(xiě) 不然會(huì)造成選框與文本重疊的問(wèn)題-->      <div class="form-group">        <button type="submit" class="btn btn-default">提交</button>      </div>    </fieldset>  </form></div>

<div class="container">  <form action="#" method="post" class="form-horizontal">    <!--form-horizontal讓表單初始化-->    <fieldset>      <legend>用戶登陸</legend>      <div class="form-group">        <label class="col-xs-3 control-label">用戶名：</label>        <!--借助柵格系統(tǒng)設(shè)置label的寬度-->        <div class="col-xs-9">          <input type="text" class="form-control" name="name" placeholder="用戶名">        </div>        <!--用div設(shè)置柵格并包裹input-->      </div>  </form></div><!--注意！把label和input放在同一行在768分辨率一下是有問(wèn)題的 在md和lg上正常-->

<div class="container">  <form action="#" method="post" class="form-horizontal">    <!--form-horizontal讓表單初始化-->    <fieldset>      <legend>用戶登陸</legend>      <div class="form-group has-feedback has-success">        <!--在項(xiàng)目的div外包圍class加has-feedback-->        <label class="col-xs-3 control-label">用戶名：</label>        <div class="col-xs-9">          <input type="text" class="form-control" name="name" placeholder="用戶名">          <span class="glyphicon glyphicon-ok form-control-feedback" aria-hidden="true"></span>          <!--在input之下添加一個(gè)span 記得加form-c-f-->        </div>      </div>  </form></div>

<div class="container">  <div class="btn-toolbar">    <div class="btn-group">      <button class="btn btn-success"><span class="glyphicon glyphicon-star"></span></button>      <button class="btn btn-info"><span class="glyphicon glyphicon-star"></span></button>      <button class="btn btn-danger"><span class="glyphicon glyphicon-star"></span></button>      <button class="btn btn-default"><span class="glyphicon glyphicon-star"></span></button>    </div>  </div></div>

<div class="col-md-4 col-md-offset-2">  <div class="input-group input-lg">    <div class="input-group-addon">      <a href=""><span class="glyphicon glyphicon-star"></span></a>    </div>      <input type="text" class="form-control input-xs">    </div>  </div></div>