首页 > 代码库 > 【转】浏览器兼容性问题汇总
【转】浏览器兼容性问题汇总
1:margin-left在IE6不生效(复现条件:块状元素、浮动、margin-left) ---------解决方法:http://www.seostudying.com/1233.html
2: position:fixed 在ie6 、ie7(quirk) 、 ie8(quirk)下被当成错误处理。-----------解决方法:http://blog.sina.com.cn/s/blog_106f3d140100yaok.html
解决思路:用 _position:absolute替代------>CSS HACK(expression)+margin ---------->防抖动处理 *html{background-image:url(about:blank); background-attachment:fixed;}
3:scrollTop 在FF chrome返回值为零 ------------解决方法:http://www.jb51.net/article/64328.htm
完美写法:var scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;
4:var ev = ev || window.event;
5:CSS3新属性background-size在IE6、7、8下兼容解决办法---------http://www.tuicool.com/articles/Vrq2Q3B
过滤器filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src=http://www.mamicode.com/‘11.gif‘, sizingMethod=‘scale‘);
6:透明兼容IE8- -------------------------------opacity / rgba
opacity: 0.5; filter:Alpha(opacity:50);
rgba(0,0,0,0.5);----------ie9+
filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#7F000000,endColorStr=#7F000000)-------------ie9-
a:0.5 -------------> b:7F a*255------>16进制转换
:root selector{filter:none\9 !important}------------------->/*ie9 hack*/
7:伪类visited在现代浏览器不兼容 -------------------------------https://hacks.mozilla.org/2010/03/privacy-related-changes-coming-to-css-vistited/
(CSS属性不兼容的话,不如用js兼容性更好)
8:js中获取子元素第一个节点
firstChild-------IE8-正常;IE9+会把空格引起的文本节点#text解析出来
firstElementChild------IE9+兼容;IE8-为undefined不报错
异或写法---------var first = ul_dom.firstElementChild || ul_dom.firstChild;
创统写法---------var first = ul_dom.children[0];
9:句号在某些机型可能不在文字右下角问题
font-style: normal; font-family: SimSun;
10:ie6下浮动元素双倍外间距--------------------http://blog.csdn.net/sinat_16411539/article/details/50582090
浮动元素加 display: inline;
11:连续a标签默认间距-----------------http://www.cnblogs.com/kevinCoder/p/6418605.html
父元素font-size:0(推荐);
a标签写在一行-----------当行内元素之间有“回车”、“tab”、“空格”时就会出现间隙
12:img与父元素底部默认间距----------------http://www.cnblogs.com/lovelyun/p/4846222.html
块级元素包含内联元素如图片文字等时,内联元素默认是和父级元素的baseline(基线)对齐的,而baseline又和父级元素底边有一定的距离(这个距离和font有关)
父元素font-size:0 或者 vertical-align:bottom
13:IE6下 a元素添加onclick事件----------------http://www.3lian.com/edu/2014/09-16/165905.html
onclick事件执行后冒泡到href是里的javascript:void(0); onclick处理函数内return false 阻止冒泡,或者去掉改变href。
14:输入框光标垂直居中line-height法不生效-----------------http://www.cnblogs.com/enmeen/p/5587825.html
去掉line-height使用其他垂直居中方法即可
【转】浏览器兼容性问题汇总