IOS input 光标大小调整

2019-05-16  本文已影响0人  八妹sss

前言

在项目中做移动端页面,发现IOS 的光标大小很大,和安卓的完全不一样,思考怎么调整大小,搜索之后发现,里面挺好玩的。觉得是可以总结一下的。

结论
IE:不管该行有没有文字,光标高度与font-size一致。
FF:该行有文字时,光标高度与font-size一致。该行无文字时,光标高度与input的height一致。
Chrome:该行无文字时,光标高度与line-height一致;该行有文字时,光标高度从input顶部到文字底部(这两种情况都是在有设定line-height的时候),如果没有line-height,则是与font-size一致。

IOS中情况和Chrome 相似。

解决

设置字体大小和行高一致,然后通过 padding 撑开大小
只给IE浏览器设置 line-height

-ms-line-height:40px; 

原文:https://blog.csdn.net/Merciwen/article/details/78220974

上一篇下一篇

猜你喜欢

热点阅读