|
直播搭建过程中对于浏览器的兼容性也在考虑的范围之内，在前端开发遇到浏览器兼容性问题，产生这个问题的主要原因是不同浏览器的内核不同，对网页的解析结果会产生差异。想要解决浏览器的兼容性问题，可以从三方面考虑：html,css,js。 Html部分 1.调用CDN的html5shiv,html5shiv.js可以实现让IE低版本浏览器识别并支持html5标签 2.img标签在图片不存在的情况下，各浏览器的解析不一致。在chrome下显示的是一张破损的图片；在fierfox下显示的是alt文字；而在IE浏览器中则显示是破损的图片加文字 3.ul标签内外边距问题。Ul标签在IE中有默认的外边距，但在最新的IE版本以及其他浏览器中有个默认的内边距。解决这一问题的方法：同一设置ul的内外边距为0 Css部分 1.css的hack问题。主要针对IE的不同版本 2.IE6双边距问题。IE6在浮动后，有横向的margin，此时，该元素的外边距是其值的2倍，解决方法：display:inline 3.IE6以下的图片下方有空隙，解决方法：给img设置display：block 4.IE6以下两个float之间会有3px的Bug，解决方法：给右边的元素也设置float:left 5.IE6以下没有min-width的概念，其默认的width就是min-width 6.IE6以下使用margin:0auto，无法使元素居中，解决方法：为其父容器设置text-align:center 7.被点击过后的超链接不再具有hover和active属性，解决方法是按“lvha”的顺序书写css样式 8.在使用绝对定位或者相对定位时，IE中设置z-index失效，原因是因为其元素依赖于父元素的z-index，但父元素默认为0，子高父低，所以不会改变显示顺序 9.IE6以下无法设置1px的行高，原因是由其默认行高引起的，解决方法:为其设置overflow:hidden;或者line-height：1px 10.不同浏览器的标签默认的外补丁和内补丁不同，解决方法：css里设置margin：0；padding：0 Js部分 1.标准的事件绑定方法函数为addEventListener,但IE以下是attachEvent 2.事件的捕获方式不一致，标准浏览器是由外之内，而IE是由内到外，但是最终的结果是将IE的判断标准设为标准 3.我们常说的事件处理时的event属性，在标准浏览器中其实是传入的，IE以下由window.event获取，并且获取的目标元素方法不同，标准浏览器是event.target，而IE以下则是event.srcElement 4.在低版本的IE重获取日期处理函数的值不是与1900的差值，但是在高版本的IE中和标准浏览器保持了一致，获取的值是与1900的差值，在IE中会获得当前年，但在firefox中则会获得当前年与1900的差值 5.ajax的实现方式不同，也就是对XMLHttpRequest的不同，IE以下是activeXObject 6.IE中不能操作tr的innerHtml 7.获得DOM节点的父节点、子节点的方式不同，其他浏览器：parentNode、parentNode.childNodes；IE：parentElement,parentElenment.children |
|
|
