由于各大主流浏览器内核不一致，常常会有一些兼容性问题需要解决，下面从css和js分别来列一下，欢迎有补充的可以积极补充～
一、咱们的css呀
1、css3属性已经出现了很久了，但是各大浏览器还是没有完全统一属性的定义，因此需要通过IDE，前缀补充或者打包时使用相关css loader来实现兼容。
2、透明属性opacity在ie浏览器9以下需要使用 filter来实现兼容，opacity: 0.5;filter: alpha(opacity = 50);filter: progid:DXImageTransform.Microsoft.Alpha(style = 0, opacity = 50);
3、ul和ol列表缩进问题，在IE中仅仅设置margin:0px即可达到最终效果，而在Firefox中必须同时设置margin:0px、 padding:0px以及list-style:none三项才能达到最终效果。
4、IE不认得min-这个定义，但实际上它把正常的width和height当作有min的情况来使。这样问题就大了，如果只用宽度和高度，正常的浏览器里这两个值就不会变，如果只用min-width和min-height的话，IE下面根本等于没有设置宽度和高度。可以这样设置最小高度为200px的容器样式，min-height:200px; height:auto !important; height:200px; overflow:visible;
5、DIV浮动IE6产生3象素的bug，紧邻着的DIV右边会有margin-left为3px 的边距，可将左边元素的 margin-right 设置为3px，或者将浮动元素设置为display:inline;如果想要设置宽高则设置为display:table
6、对齐文本与文本输入框，将文本和文本框vertical-align都设置为middle时在IE下不适应。
7、内容超过长度后以省略号显示，width:200px; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; overflow: hidden;在firefox 浏览器中不适合。
8、ie浏览器设置滚动条颜色是需要设置html元素，其他浏览器是body。
9、css的hack问题：主要针对IE的不同版本，不同的浏览器的写法不同 IE的条件注释hack： <!--[if IE 6]>此处内容只有IE6.0可见<![endif]--> <!--[if IE 7]>此处内容只有IE7.0可见<![endif]-->这样
10、不同浏览器的标签默认的外补丁（margin）和内补丁（padding）不同，css里增加通配符*{margin：0；padding：0}
二、咱们的 js呀
1、浏览器事件定义和销毁的方式在ie和其他浏览器中会有区别，一般会写一个适配器去重新定义实现事件监听和解绑，一般浏览器会addEventListener和removeEventListener方法，而ie浏览器用到 attachEvent和detachEvent方法，事件回调传入的event对象需要拿到事件触发对象target活着srcElement(ie)。
2、new Date() 函数需要传入‘2020/0717’这样的字符串才会兼容。
3、得到scrollTop需要写document.documentElement.scrollTop||document.body.scrollTop
4、ajax对象一般浏览器是xmlHtppRequest，而ie浏览器是activeXObject
5、在ie9以下，不能操作tr的innerHTML
6、FireFox中类似obj.style.height = imgObj.height的语句无效。7、innerText在IE中能正常工作，但在FireFox中却不行，需用textContent。
解决方法:
if(navigator.appName.indexOf("Explorer") > -1){
document.getElementById('element').innerText = "my text";
} else{
document.getElementById('element').textContent = "my text";
}
三、再说说html
基本上无太多问题，主要是ie9以下使用html5会有问题，可以用hack来解决，如下：
