Html 如何在 CSS 中设置输入（文本）字段的高度？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12893205/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to set the height of an input (text) field in CSS?
提问by Arrie
Sorry for this question but I can't seem to find an answer anywhere. I have CSS code that should set the height of my text box. I am using VS2010 Express for Windows phone, coding in HTML/CSS/Javascript/C#.
很抱歉这个问题，但我似乎无法在任何地方找到答案。我有 CSS 代码应该设置我的文本框的高度。我在 Windows 手机上使用 VS2010 Express，用 HTML/CSS/Javascript/C# 编码。
HTML
HTML
<input class="heighttext" type="text" id="name">
CSS
CSS
.heighttext{
height:30px
}
I can set the height to anything I like, but the text box will stay the same! Please help, or at least send me a link that can!
我可以将高度设置为我喜欢的任何值，但文本框将保持不变！请帮忙，或者至少给我一个可以的链接！
回答by Dipak
Try with paddingand line-height-
试着用padding和line-height-
input[type="text"]{ padding: 20px 10px; line-height: 28px; }
回答by danwellman
Form controls are notoriously difficult to style cross-platform/browser. Some browsers will honor a CSS heightrule, some won't.
众所周知，表单控件很难跨平台/浏览器设置样式。有些浏览器会遵守 CSSheight规则，有些则不会。
You can try line-height(may need display:block;or display:inline-block;) or topand bottom paddingalso. If none of those work, that's pretty much it - use a graphic, position the inputin the center and set border:none;so it lookslike the form control is big but it actually isn't...
您可以尝试line-height（可能需要display:block;或display:inline-block;）或top和bottom padding。如果这些都不起作用，那就差不多了 - 使用图形，将其input放置在中心并设置，border:none;以便看起来表单控件很大但实际上不是......
回答by HAPPY SINGH
Don't use height property in input field.
不要在输入字段中使用高度属性。
Example:
例子：
.heighttext{
display:inline-block;
padding:15px 10px;
line-height:140%;
}
Always use paddingand line-heightcss property. Its work perfect for all mobile device and all browser.
始终使用padding和line-heightcss 属性。它适用于所有移动设备和所有浏览器。
回答by Rusty
You should use font-size for controlling the height, it is widely supported amongst browsers. And in order to add spacing, you should use padding. Forexample,
您应该使用 font-size 来控制高度，它在浏览器中得到广泛支持。为了增加间距，您应该使用填充。例如，
.inputField{
font-size: 30px;
padding-top: 10px;
padding-bottom: 10px;
}
回答by Saeed
You use this style code
您使用此样式代码
.heighttext{
float:right;
height:30px;
width:70px;
}
回答by Ravi Kumar Yadav
The best way to do this is:
最好的方法是：
input.heighttext{
padding: 20px 10px;
line-height: 28px;
}
