浏览器兼容性问题简介.ppt

你遇到过这些问题吗 内容 浏览器兼容性问题分类 浏览器的“模式” 如何编写具有良好兼容性的网页 浏览器兼容性问题分类 显示问题：CSS兼容性 height/width, position:fixed, … 脚本问题：Java Script 兼容性 DOM, Date.getYear, scrollTop, … 缺陷（bug）与特性（feature） IE: 盒模型，float，text-align IE: filter，behavior，execCommand 有多少种浏览器？ 浏览器的“模式” 标准模式 (Standards mode) 怪异模式 (Quirks mode)，又称怪癖模式或兼容模式 浏览器根据页面指定的 DOCTYPE 来选择使用何种模式渲染页面 !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN /TR/xhtml1/DTD/xhtml1-transitional.dtd !DOCTYPE html 页面实际采用的渲染模式可使用脚本来检测： patMode: BackCompat CSS1Compat 浏览器的模式会影响到： CSS 的页面布局 例如：IE box model CSS 的解析 例如：!important 是否支持 脚本的行为 例如：document.body.scrollTop / document.documentElement.scrollTop Firefox 在 Quirks Mode 下支持 id 引用 怎样使用 DOCTYPE 来指定页面在浏览器中的渲染模式 最常见的一种标准模式 !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN /TR/xhtml1/DTD/xhtml1-transitional.dtd 标准模式 !DOCTYPE html !DOCTYPE html PUBLIC -//W3C//DTD HTML 4.01//EN /TR/html4/strict.dtd 怪异模式 没有 DOCTYPE 标记 IE8 的模式异常复杂 IE8 有三种模式：Standards, Quirks, IE7 IE8 使用异常复杂的方式来判断使用何种模式进行渲染： X-UA-COMPATIBLE HTTP header meta http-equiv=X-UA-Compatible content=IE=EmulateIE7 DOCTYPE blacklist 如何编写具有良好兼容性的网页 使用标准模式 !DOCTYPE html 阅读 W3C 的 CSS 标准 /TR/CSS2/ 在 IE 及非 IE 浏览器上进行测试 浏览器兼容性问题简介 Firefox IE6 …… : Quirks Mode : IE7 Mode From why to how