textarea中的光标位置,具有不同的字体和高度线大小

时间:2012-10-17 16:27:40

标签: html css internet-explorer

我尝试为textarea控件设置字体大小(13px)和行高(23px)。

例如第一个代码:(http://jsfiddle.net/D6T4f/

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

如果我在空白文本区域内单击,光标将位于正确的位置。

但是在这段代码中我添加了样式 background-color :( http://jsfiddle.net/4e2dL/

<TEXTAREA style="background-color: white; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 23px; height: 70px;"></TEXTAREA>

我只添加了一种风格 background-color:white; 。因此,如果我尝试在textarea中单击,则光标将与第一个代码中的位置不同(略高)。但是如果我开始键入一些文本,光标将移动到正确的位置。

如果我需要使用这种风格,如何避免这种情况?

问题出现在IE 9中.Chrome(最新)没问题。

如果我使用样式 background-image:none;

,也会出现同样的问题

谢谢!

2 个答案:

答案 0 :(得分:2)

您可以尝试删除此处之间的空格或新行吗

这可能是因为这个原因。

答案 1 :(得分:0)

它只是一个IE9问题,它看起来是一个当你添加背景样式时它也会覆盖并删除一些其他标准的IE9样式。

解决方案,您将需要更明确地使用您的样式来帮助规范化影响textareas的样式。我已经将示例放在一起,其中textarea的样式已被css样式完全覆盖将两个内联:http://jsfiddle.net/PXgxU/2/