我将Bootstrap 3样式应用于我的编辑表单。但是,我想减少输入框和字体大小的填充。
因此,它使我的编辑形式更大。 我试图更改网格列类(col-sm- ,col-md - ),但它没有帮助。
并且还会覆盖 css ,它会使输入框不显示文字。
.form-horizontal .form-group input,
.form-horizontal .form-group select,
.form-horizontal .form-group label {
height: 14px;
line-height: 14px;
}
HTML:
<div class="form-group">
<label for="txtProductName" class="col-sm-2 control-label">Name :</label>
<div class="col-md-3">
<input type="text" id="txtProductName" CssClass="form-control"/>
</div>
</div>
答案 0 :(得分:11)
总的来说,我不建议覆盖bootstrap中的响应式网格,因为这是使用它的主要原因!
要覆盖表单样式,只需使用下面的代码。
<强> HTML 强>
<div class="form-group">
<label for="txtProductName" class="col-sm-2 control-label">Name :</label>
<div class="col-md-3">
<input type="text" id="txtProductName" Class="form-control form-fixer"/>
</div>
</div>
<强> CSS 强>
input.form-fixer {
padding: 1px;
font-size: 19px;
}
.form-horizontal .form-group input,
.form-horizontal .form-group select,
.form-horizontal .form-group label
{
height: 14px;
line-height: 14px;
}
还有一个Jsfiddle设置.... http://jsfiddle.net/ZRosenbauer/4wDKp/