Bootstrap的form-group form-control input-group button-group
生活随笔
收集整理的這篇文章主要介紹了
Bootstrap的form-group form-control input-group button-group
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
1.設置輸入框的上下大小form-group? 不直接設置? 在外面包圍div進行設置
? ?設置輸入框的樣式form-control
<form role="form"><div class="form-group"><input type="email" class="form-control" placeholder="Enter email"></div> </form>向所有的文本元素 <input>、<textarea> 和 <select> 添加 class ="form-control" 。 把標簽和控件放在一個帶有 class?.form-group?的 <div> 中。這是獲取最佳間距所必需的。2.form-control的效果
form-control 將會實現一些設計上的定制效果。 1、寬度變成了100% 2、設置了一個淺灰色(#ccc)的邊框 3、具有4px的圓角 4、設置陰影效果,并且元素得到焦點之時,陰影和邊框效果會有所變化 5、設置了placeholder的顏色為#9993.input-group:進行組裝??
<div class="col-md-3 col-md-offset-2"><!-- input-group進行組裝--><div class="input-group"><span class="input-group-addon"><span class="glyphicon glyphicon-plus"></span></span><input type="text" class="form-control"></div></div>4.button-group按鈕組
<div class="btn-group"><button type="button" class="btn btn-default">按鈕</button><button type="button" class="btn btn-default">按鈕</button><button type="button" class="btn btn-default">按鈕</button></div>?
總結
以上是生活随笔為你收集整理的Bootstrap的form-group form-control input-group button-group的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 中国投资协会是属于什么机构
- 下一篇: Bootstrap的role