减lessTwitter Bootstrapinput字段的高度？
在我的表单中，我想减lessinput字段的高度。
我知道有input小，input媒体类控制input字段的宽度，但有没有类似的控制高度？
我找不到任何，如果不是我怎么去覆盖默认值？
我找不到任何，如果不是我怎么去覆盖默认值？
Bootstrap的input字段高度是使用属性select器来定义的，例如input[type="text"], input[type="password"]
您可以用相同的select器格式的样式覆盖它，或者使用类和类。
.mystyle input[type="text"] { height: 14px; font-size: 10px; line-height: 14px; }
根据Bootstrap文档： 引导CSS ，你应该使用.input-sm
如果你要编写你自己的CSS，你并没有真正利用Bootstrap的强大function。
<input class="form-control input-sm" type="text" placeholder=".input-sm">
它只是改变@Neps提到的height属性
但是，我不得不在我自己的CSS中覆盖.input-sm来获得正确的大小。
我只想尽可能使用Bootstrap类。
是的，有控制高度的课程。 你可以在这里阅读。
input-lg input-sm
我build议学习使用LESS或SASS编译器作为引导文件，然后使用Bootstrap下载LESS / SASS文件。 这不是非常困难，而且实际上是你“定制”自定义Bootstrap的方式。 对于一两个调整可能有点笨重，但是对于整体颜色scheme或者网格/input控件间距和填充等事情来说，它实际上要好得多，因为LESSvariables是普遍的，并且可能适用于您不想要的东西，不要以为重写。 例如，你应该用“表格控制”类来装饰所有的input。 “form-control”和“output”类是在文件forms.less中定义的，字段的高度是基于很多variables检查出来的：
.form-control { display: block; width: 100%; height: @input-height-base; // Make inputs at least the height of their button counterpart (base line-height + padding + border) padding: @padding-base-vertical @padding-base-horizontal; font-size: @font-size-base; line-height: @line-height-base; color: @input-color; background-color: @input-bg; background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214 border: 1px solid @input-border; border-radius: @input-border-radius; // Note: This has no effect on <select>s in some browsers, due to the limited stylability of <select>s in CSS. .box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); ...more stuff I removed... }
所有的variables都是单独定义的，易于与文件一起使用，并且所做的更改会影响所有内容。 这是一个示例：
//== Components // //## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start). @padding-base-vertical: 6px; @padding-base-horizontal: 12px; @padding-large-vertical: 10px; @padding-large-horizontal: 16px; @padding-small-vertical: 5px; @padding-small-horizontal: 10px; @padding-xs-vertical: 1px; @padding-xs-horizontal: 5px; @line-height-large: 1.3333333; // extra decimals for Win 8.1 Chrome @line-height-small: 1.5; @border-radius-base: 4px; @border-radius-large: 6px; @border-radius-small: 3px; //** Global color for active items (eg, navs or dropdowns). @component-active-color: #fff; //** Global background color for active items (eg, navs or dropdowns). @component-active-bg: @brand-primary; //** Width of the `border` for generating carets that indicate dropdowns. @caret-width-base: 4px; //** Carets increase slightly in size for larger components. @caret-width-large: 5px;
如果新版本的BS出来，你只需使用编译器将旧的variables应用到新的BS文件。
链接： http ： //getbootstrap.com/customize/
Visual Studio用户： https : //marketplace.visualstudio.com/items?itemName=MadsKristensen.WebCompiler
