一、a元素包裹img,img元素在IE9如下浏览器会有蓝色边框,点击a连接后变成紫色边框, 解决方案:html
img { border: none; }
二、a包裹img/文字,点击时的一瞬间会在IE9如下浏览器中出现虚线边框。解决方案:web
a:focus {outline: none; }
三、img底部3pxbug,最好用display: block。若是用vertical-align: top/bottom,当你在缩放页面时,底部有时会多1px。
三、forEach是数组的方法,当循环一组DOM对象(伪数组)时在IE和safari中会有问题。解决方案:数组
Array.prototype.forEach.call(lis, function (item) { item.innerHTML = item.innerHTML + new Date(); })
四、禁止文字选中浏览器
moz-user-select: -moz-none; -moz-user-select: none; -o-user-select:none; -webkit-user-select:none; -ms-user-select:none; user-select:none
五、禁止鼠标右键菜单svg
document.oncontextmenu = function () { return false; }; document.onselectstart = function () { return false; };
六、safari浏览器不支持 new Date(‘2018-08-08’) 写法,解决方案: new Date(‘2018/08/08’)。spa
七、移动端点击a元素会有蓝色背景,去除方法:prototype
-webkit-tap-highlight-color: transparent;
八、去除移动端水平方向的滚动条。code
html { overflow-x: hidden; }