chrome中Textarea中的行高与光标高度问题答案

【问题标题】：line-height vs cursor height issue in Textarea in chromechrome中Textarea中的行高与光标高度问题
【发布时间】：2013-07-20 08:31:37
【问题描述】：

如果我们指定 line-height 大于 font-size，我们是否可以像 font-height 一样减小光标高度。在 Chrome 浏览器中查看这个fiddle，你就会明白我在说什么。这在 Firefox 中运行良好，问题仅在 Chrome 浏览器中。文本区域 html 是：

<TEXTAREA style="font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 50px; height: 150px;"></TEXTAREA>

编辑：

我想要行之间的行高空间，因为我有 textarea 的背景图像，我试图在其上放置文本的水平线。

【问题讨论】：

你不想要插入符号中间的文字吗？
您可以使用 jquery 从 div 中创建一个 textarea，然后您将拥有更多的灵活性
这一切都是通过line-height属性发生的。

标签： jquery html css

【解决方案1】：

听起来好像您想更改位于文本区域内的插入符号。这是一篇涵盖此内容的帖子。

Styling text input caret

【讨论】：

【解决方案2】：

try this for line height space between line...


<div style="background-color: lime; line-height: 2cm;">
testing line height - line 1 <br>
testing line height - line 2 <br>
</div>

【讨论】：

这不是提问者想要的。我相信提问者希望使用 line-height 来增加行间距，但将光标大小与 font-size 保持相同。

【解决方案3】：

我已经在 Chrome 中尝试过这段代码，它是成功的。现在你实现并检查你的代码。

<TEXTAREA style="font-family: Arial, Helvetica, sans-serif; font-size:13px; line-height: 10px; height: 150px;"></TEXTAREA>

【讨论】：

OP 想要行之间的行高空间。
是的，我想要行之间的行高空间，因为我有 textarea 的背景图像和水平线，我正在尝试在其上放置文本。
这不是提问者想要的。我相信提问者希望使用 line-height 来增加行间距，但将光标大小与 font-size 保持相同。