bootstrap 表單 label 和 input 實現左標籤右輸入佈局
阿新 • • 發佈:2019-01-30
首先直接貼效果圖
要求就是label和input的輸入框 這樣排列,下面是程式碼 加註釋
<%--首先表單垂直佈局 form-horizontal --%> <div class="form-horizontal"> <fieldset> <%--form-group 實現這個一個組--%> <div class="form-group"> <%--label標籤佔十二列中間的兩列 control-label使標籤居左對齊--%> <label class="col-sm-2 control-label">暱 稱:</label> <%--佔七列 並且造一個input組--%> <div class="col-sm-7 input-group"> <input type="text" class="form-control"> <span class="input-group-addon"> <span class="glyphicon glyphicon-user"></span> </span> </div> </div> </fieldset> </div>