css input光标偏上问题

最近在做项目的时候发现input的光标有点问题（手机端）：当给定input的line-height的时候光标偏上。查阅资料得知：

• 在Chrome浏览器中，当设置了line-height时，input无文字，光标高度与line-height一致；input有文字，光标高度从input顶部到文字底部。当没有设置line-height时，则是与font-size一致。

因此，要么在外层div给定高度和行高使得input文字和光标居中，要么让input的高度等于里面文字的高度，然后用padding把框撑起来，这样光标的高度和位置就固定了。如：

input{
    height: 14px;
    padding: 4px 0px;
    font-size: 14px;
}