兼容ios浏览器记录
写的好好的网站 到真机·iphone上会被各种兼容坑的苦不堪言。
今天来介绍几种常见坑的解决办法。
一、：hover在ios无效问题
这个比较简单。只需要在按钮元素或body或html上绑定一个touchstart事件，激活:active状态就好了。
1. js绑定
document.body.addEventListener('touchstart',function(){});
1. html添加
<body ontouchstart>
二、部分元素存在默认样式的问题
在制作手机网站的时候用Safari 打开相应的页面，会发现button,input,select,textarea都存在着默认的样式，我们设置的样式都被默认样式盖住了，这时只需要添加一个webkit的私有属性：
-webkit-appearance:none;
添加该样式，并且值为’none’时即可取消浏览器对于控件的默认样式。
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
关于这个问题的话，我建议使用 normalize.css
normalize.css已经去除了所有浏览器的默认样式 大小才几kb。
扫一扫
1951
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
