1500字范文,内容丰富有趣,写作好帮手!
1500字范文 > 遇到的兼容性问题

遇到的兼容性问题

时间:2020-03-23 13:29:23

相关推荐

遇到的兼容性问题

1、不同浏览器的标签默认的margin和padding不同

随便写几个标签,不加样式控制的情况下,各自的margin 和padding差异较大。

碰到频率:100%

解决方案:

CSS里*{margin:0;padding:0;}但是性能不好一般我们会引入reset.css样式重置;

2、图片加a标签在IE9中会有边框

解决方案:img{border: none;}

3、边距重叠问题;

当相邻两个元素都设置了margin 边距时,margin 将取最大值,舍弃最小值;

解决方案:为了不让边重叠,可以给子元素增加一个父级元素,并设置父级元素为overflow:hidden;

4、cursor:hand 显示手型在safari 上不支持

解决方案:统一使用 cursor:pointer

5、IE不支持ES6语法

解决方案:用Babel进行转换

6、移动端。在安卓机上placeholder文字设置行高会偏上

解决方案:input有placeholder情况下不要设置行高

7、overflow:scroll,或者auto在iOS上滑动卡顿的问题

解决方案:加入-webkit-overflow-scrolling:touch;

8、移动端click 300ms 延时响应

解决方案:使用 Fastclick

window.addEventListener( "load", function() {FastClick.attach( document.body );}, false );

9、input为fixed定位,错位问题。

在ios下input固定定位在顶部或者底部,在页面滚动一些距离后,点击input(弹出键盘),input位置会出现在中间位置。

解决方案:内容列表框也是fixed定位,这样不会出现fixed错位的问题

10、ios下input为type=button属性disabled设置true,会出现样式文字和背景异常问题。

解决方案:使用opacity=1来解决

11、对非可点击元素如(label,span)监听click事件,部分ios版本下不会触发。

解决方案:css增加cursor:pointer

12、IE浏览器使用GET发送请求时,如果两次请求的地址和参数相同,在不刷新页面的情况下,浏览器会缓存第一次请求的内容。

需要在axios中,给get请求加个时间戳

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。