手机
当前位置:查字典教程网 >网页设计 >XHTML >input输入框中的光标大小显示不一致的解决方法
input输入框中的光标大小显示不一致的解决方法
摘要:input输入框中的光标大小显示不一致ie7中和chrome的非常明显先看看问题产生的原因:chrome浏览器对光标高度的设置原则为,当没有...

input输入框中的光标大小显示不一致

ie7中和chrome的非常明显

先看看问题产生的原因:chrome浏览器对光标高度的设置原则为,当没有内容的时候光标的高度=input的line-height的值,当有内容时,光标从input的顶端到文字的底部。

OK,既然知道了原因,我们就相应才去一些措施。尝试了两种方法去做:。

方法1:将line-height的值设置为跟字体大小一致;如果高度达不到,用padding去撑;

方法2:对chrome不设置line-height,它会自动文字居中,对ie进行hack设置line-height的值以保证文字垂直居中;这里要注意一下,如果在reset的样式文件中有设置line-height等值,请进行line-height的重置,可以用line-height:normal。具体可以看看腾讯好莱坞页面的搜索框。

具体css:

height: 34px;

font-size: 12px;

line-height: normal;

line-height: 34px9;

【input输入框中的光标大小显示不一致的解决方法】相关文章:

html 自定义标签使用实现方法

html 中文乱码 HTML超链接中文乱码问题分析及解决方法

html中使用margin:0 auto整个页面不居中的解决方法

textarea布局时文字在左下边且不能改变大小尺寸的解决方法

定义input type=file 样式的方法

超链接的宽度和高度直接设置不起作用的解决方法

textarea标签大小不可变不能通过鼠标拖动的方式来拖动

Firefox下英文字母不换行的解决方案

HTML中的标签和元素的区别详解

flash嵌入html 在html网页代码中嵌入Flash文件的解决方案(上)

精品推荐
分类导航