?

　　表單主要功能是用來與用戶做交流的一個網頁控件，良好的表單設計能夠讓網頁與用戶更好的溝通。表單中常見的元素主要包括：文本輸入框、下拉選擇框、單選按鈕、復選按鈕、文本域和按鈕等。其中每個控件所起的作用都各不相同，而且不同的瀏覽器對表單控件渲染的風格都各有不同。

　　

<form role="form"><div class="form-group"><label for="exampleInputEmail1">郵箱：</label><input type="email" class="form-control" id="exampleInputEmail1" placeholder="請輸入您的郵箱地址"/></div><div class="form-group"><label for="exampleInputPassword1">密碼</label><input type="password" class="form-control" id="exampleInputPassword1" placeholder="請輸入您的郵箱密碼"/></div><div class="checkbox"><label><input type="checkbox"/>記住密碼</label></div><button type="submit" class="btn btn-default">進入郵箱</button></form> 基礎表單

?

　　Bootstrap中主要將這些元素的margin、padding和border等進行了細化設置。當然表單除了這幾個元素之外，還有input、select、textarea等元素，在Bootstrap框架中，通過定制了一個類名`form-control`，也就是說，如果這幾個元素使用了類名“form-control”，將會實現一些設計上的定制效果。

　　1.?寬度變成了100%

　　2.?設置了一個淺灰色（#ccc）的邊框

　　3.?具有4px的圓角

　　4.?設置陰影效果，并且元素得到焦點之時，陰影和邊框效果會有所變化

　　5.?設置了placeholder的顏色為#999

?

　　運行效果圖

轉載于:https://www.cnblogs.com/qingyuan/p/4598606.html

總結

以上是生活随笔為你收集整理的Bootstrap系列 -- 11. 基础表单的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。