CSS中textarea的最小高度是多少？

Question

我在不同的浏览器中试过了，但似乎没有起作用。如果我改变数字（min-height），超过50它就可以工作，在50以下的任何值范围内它都保持相同高度。那么，有没有办法将文本域的最小高度保持在50以下，比如10px？

<textarea style="width:700px;resize:none;min-height:10px;"></textarea>
<textarea style="width:700px;resize:none;height:10px;"></textarea>

- Parveez Ahmed

Answer 1

这与文本区域(rows属性)的默认值有关！ 根据http://www.w3schools.com/tags/att_textarea_rows.asp，默认值为2。

因此，尝试将其更改为1，并稍微调整高度属性。

如果您需要比1行更小的文本区域，请在CSS中调整文本区域的样式“line-height”。

- João Pinho

Answer 2

min-height 属性设置元素的最小高度，正如其名称所示。这意味着除非没有任何内容需要更大的高度，否则将使用此高度。对于 textarea 元素，默认高度是由行数（由 rows 属性指定，浏览器的实践和 HTML5 CR 将其默认设置为 2）和浏览器计算的行高来确定的。

因此，您可以将 min-height 设置为 10px，它按定义起作用 - 实际高度更大，但这符合定义。

要设置高度，您可以使用 height 属性，例如您的示例中，以及/或 rows 属性，该属性间接设置高度。与通常情况一样，它设置了内容高度。文本框的总高度是内容高度加上顶部填充加上底部填充加上顶部边框加上底部边框。

难以想象有什么情况下将文本框高度设置为 10px 是有意义的，这甚至不足以展示一行文字并且大多数人能够辨认字体大小。此外，如果您真的想要一个不可调整大小但只有一行高度的输入框，那么 input type=text 元素将是比textarea 更实用和更合理的选择。

- Jukka K. Korpela