html5兼容性问题[参照].pdfVIP

网页设计 html+css 兼容性问题处理办法汇总 标准网页布局的 兼容性处理 标准 网页设计 的最大挑战不在于技术本身，而在于 浏 览器兼容性 处理。所谓浏览器兼容问题，就是当我们 使用不同的浏览器（如 IE 7、IE 6、Firefox 等）访问 同一个页面时，可能会出现不一致的情况，出现这种 现象的原因有很多种，但根本原因就是浏览器对于技 术支持的标准不同造成的。 IE 浏览器对于标准技术的支持是很不完善的， 这些问 题可以分为两种： 一种是 IE 支持某种技术或功能， 但 是实现该功能的方法和途径与标准技术不同；另一种 是 IE 浏览器自身的解析机制存在很多 Bug，导致页面 解析效果与标准不同。 本章将兼顾 IE 6、IE 7 和 FF 三种主流版本或类型浏览 器进行讲解，其中 IE 6 浏览器用户数最多， IE 7 的用 户将逐步超越和代替 IE 6 ，而 FF 浏览器代表了标准浏 览器的主流。 1 兼容不同类型浏览器的基本方法 不同类型浏览器对于 CSS 技术的支持是不完全统一 的，如果再加上浏览器对于 CSS解析时存在各种 Bug， CSS 兼容性处理就变得异常复杂。 解决浏览器兼容问题的方法， 这些方法被称之为 Hack （即补丁的意思）。所谓 Hack，就是利用各种过滤方 法专门为特定类型浏览器定义样式，即称之为过滤器 （Filter ），从而实现在不同类型浏览器中呈现相同的 渲染效果。 过滤器是一种形象的称呼，实际上它就是各种浏览器 支持或不支持某种声明或样式的特殊用法。 例如，IE 6 以下版本浏览器不支持 !important 关键字，我们就可以 利用这个关键字专门为 IE 6 及其以上版本浏览器或者 非 IE 浏览器定义样式，从而过滤掉 IE 6 以下版本浏 览器在解析时存在的问题。 2 1 标准网页布局的兼容性处理 1.1 常用过滤器 目前全球设计师发现并总结出来的过滤器非常多，要 记住这些过滤器是很繁琐的，读者可以参阅 /ref/css/filters/ 3 1 标准网页布局的兼容性处理 1.1 常用过滤器 munis.co.uk/dithered/css_filters/css_onl y/index .html 4 1 标准网页布局的兼容性处理 1.1 常用过滤器 IE 7 版本浏览器专用过滤器 如果专门为 IE 7 版本浏览器定义样式， 则可以使用如 下过滤器。 该过滤器还可以兼容即将上市的 IE 8 版本 浏览器。 style type=text/css *+html body { background:blue; } /style 兼容原理： “*符号在” IE 浏览器中被认为是根节点，所以它可以 包含 html 元素，而对于非 IE 浏览器来说，文档根节 点应该是 html ，而不是 “* ，所以当使用” “*通用符号” 包含 html 元素时，非 IE 浏览器会认为它是非法的， 从而忽略这个选择器所定义的样式。 同时 IE 6 及其以 下版本浏览器不支持相邻选择器 （+ ），所以也会忽略 该选择器定义的样式。 5 1