我正在使用 Twitter Bootstrap 及其表单组件:
http://twitter.github.com/bootstrap/base-css.html#forms
如何减小两个组件之间的垂直距离并使它们变小?
示例:在上面的链接中,在“验证状态”中,如何减小“带警告的输入”行和“带错误的输入”行之间的差距,以及如何减小文本输入的高度?
最佳答案
如果您想将标签移近您需要更改宽度的输入。
.form-horizontal .control-label {
width:160px;
}
要更改输入的高度,您需要更改此选择器的“高度”属性。
select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input {
height:20px;
}
要减小行之间的高度,您需要更改行的边距。
.form-horizontal .control-group {
margin-bottom:20px;
}
这些是在 bootstrap.css 中使用的默认样式。如果你想覆盖这些我建议在你的页面上设置一个顶级类。这样您就可以覆盖默认值而无需重写 bootstrap.css 文件...
关于css - 降低 Bootstrap 表单组件之间的高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12942310/