本文共 826 字，大约阅读时间需要 2 分钟。

为什么各浏览器会产生兼容性问题？

不同的浏览器内核不一致，导致网页解析差异。解决方法从HTML、CSS、JS三方面入手。

a. HTML5新标签支持问题。

b. img alt属性显示差异。

c. ul标签内外边距问题。

2. CSS部分

a. HACK技术支持IE不同版本。

特殊注释仅对于特定浏览器生效。

b. IE6横向 margin问题。

设置display:block解决外边距显示问题。

c. IE6图片下空隙调整。

图片设置display: block-match-parent。

d. IE6浮动条中3px杂乱问题。

右元素也设置float:left。

e. IE6缺少min-width不支持。

需手动设置。
IE6不可直接居中，父容器设置text-align：center。

h. 绝对定位顺序依赖父元素z-index。

父元素默认0，子无法改变。

i. 行高设置问题。

overflow: hidden或 line-height:1px。
3. JS部分

a. 事件绑定方式差异。

standard: addEventListener，IE: attachEvent。

b. 事件对象获取不同。

standard: event.target，IE：event.srcElement。

c. 日期处理函数差异。

IE低版本日期差值计算不同。

e. X AjAx方式不同，IE用activeX获取XMLHttpRequest。

f. Tr innerHTML资料获取问题。

g. 子节点获取方式。

综上，针对不同浏览器常见兼容性问题，可借助html5shim、CSS hack、特定JS处理方式进行优化，实现跨浏览器统一显示效果。