网页兼容性调试

标签：

网页兼容性调试-流程

写作规范高质量的代码出兼容性问题的可能性较小。所以出了问题要考虑是否代码结构不规范

兼容性问题两大原因：
不同分辨率下的兼容性调试
不同浏览器下的兼容性调试

显示器分辨率和浏览器市场份额
http://tongji.baidu.com/data/browser

QQ同时在线人数和分布
http://im.qq.com/online/index.shtml

浏览器分类

国际品牌浏览器
IE：ie6 7 8 9 10 11
chrom
firefox
safari
opera

国产山寨牌浏览器
360：安全版，极速版
搜狗：兼容版，高速版
猎豹：兼容版，高速版
遨游
QQ
taobao
百度。。。

浏览器内核
webkit(Bink)：chrom，opera,safari,山寨牌所有极速版浏览器(应用最广)
Trident：ie浏览器，山寨牌所有兼容版浏览器
Gecko：firefox

网页兼容性调试流程

注意：网页必须有文档申明，否则容易出现兼容性问题 ，尤其是IE

前提：网页必须在高级浏览器下制作，例如chrome，
开发网页时候，尽量固定页面宽度（960px,980px(推荐),1000px,1200px....）
(如果不固定页面宽度（弹性布局/响应式布局需要专门设计），当页面内容复杂时，不同分辨率下布局会错位)
网页制作完成后：

1：chrome下兼容性调试
不同分辨率下兼容性调试
1：自己电脑分辨率下网页兼容性
2：比我电脑更小的分辨率下调试
缩小浏览器宽度高度来模拟低分辨率情况
如果变形，需要给元素设置固定宽、高、边距等样式
3：比我电脑更大的分辨率下调试
缩小浏览器上的网页近似模拟高分辨率情况
注意：只是近似模拟，不是完全相同
调试结果仅用于测试网页超大背景颜色和图片、网页模块的居中布局情况
（缩小页面调试完成后记得回复页面比例：ctrl+0）

2：其他浏览器下兼容性调试
所谓其他浏览器，狭义指的就是 ie6,ie7,
1：使用chrome制作网页
2：使用ie查看网页
先用本系统自带ie查看网页
再按ie f12，切换ie不同版本查看网页（注意ie7）
再使用ietester软件，模拟ie6查看网页
（下面步骤根据需要可做可不做）
如有必要，本机安装虚拟机（virtualPC），安装xp系统，使用内置ie6调试网页
如有必要，再使用其他浏览器（国际、山寨）调试网页。
3:使用chrom做移动端调试

网页兼容性调试

标签：

原文地址：http://www.cnblogs.com/lyp123/p/5663413.html