ipnone6手机下input兼容性问题

1.ios中设置readonly还会有光标？

 在input上添加 unselectable="on" onfocus="this.blur()" 即可

 

2. 解决input标签在IOS浏览器中光标过长的问题

   不要给input加高度，加padding撑开就行了

IE：不管该行有没有文字，光标高度与font-size大小一致

FF：该行没有文字时，光标大小与input的 height 大小一致；该行有文字时，光标大小与font-size大小一致

chrome：有2种情况，①设置了line-height  该行没有文字时，光标大小与input的 line-height 大小一致; 该行有文字时，光标大小从input顶部到文字底部

　　　　　　　　　　 ②没有设置line-height  光标大小与font-size一样

所以，input在使用的时候，最好不要设line-height, 可以设定一个较小的height, 然后用 padding 来撑开，这样基本上可以解决所有浏览器的问题

input{
    height: 10px;
    padding: 10px 0px;
    font-size: 12px;
}

 

查看全文