码迷,mamicode.com
首页 > 其他好文 > 详细

bootstrap部分源码解析

时间:2019-06-02 16:24:21      阅读:107      评论:0      收藏:0      [点我收藏+]

标签:input   round   cal   pad   rap   text   lin   spl   bootstrap   

一、表单(基本表单、内联表单、水平表单)
```html
<form class="form-inline">
<div class="form-group">
<label></label>
<input type="text" class="form-control"/>
</div>
</form>
```
```css
/* form-inline没有单独样式 */
.form-inline .form-group {
display: inline-block;
margin-bottom: 0;
vertical-align: middle;
}
.form-inline .form-control {
display: inline-block;
width: auto;
vertical-align: middle;
}
/* form-control有单独样式 */
.form-control {
display: block;
width: 100%;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857143;
color: #555;
background-color: #fff;
border: 1px solid #ccc;
border-radius: 4px;
}
```
```css
.form-inline .control-label {
margin-bottom: 0;
vertical-align: middle;
}

.form-horizontal .control-label {
padding-top: 7px;
margin-bottom: 0;
text-align: right;
}
```

bootstrap部分源码解析

标签:input   round   cal   pad   rap   text   lin   spl   bootstrap   

原文地址:https://www.cnblogs.com/gushixianqiancheng/p/10962882.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!