CSS代码兼容主要由Hack和Filter两种方法来解决相关问题。
Hack：一种兼容CSS在不同浏览器中正确显示的方法。
Filter：一种特殊的浏览器或浏览器组显示或隐藏规则或声明的方法。
注意：
Hack是一种非官方技术，主要依赖各种字符组合，以及规则和声明的重复定义实现在不同浏览器之间达到相同的效果。
但是Hack也有副作用，如降低代码的可读性，增加了代码的负担。
设计CSS Hack 和 Filter通常有两种方法：
- 利用浏览器自身的Bug，来隐藏或显示样式或声明。
- 利用浏览器对CSS支持的不完善，如对某些规则或语法还没有形成支持，来隐藏或显示样式。
一般建议使用第二种方法来实现浏览器的兼容。
最新最权威的CSS Filter技术汇总：http://www.communis.co.uk/dithered/css_filters/css_only/index.html
显示模式：各大浏览器厂商为了实现对标准网页和传统网页的兼容性，分别为浏览器制定了几套网页显示方案。
微软从IE6.0以上版本浏览器嵌入了两种显示方案分别是：Standards Mode（标准模式）和 Quirks Mode（怪异模式）。
标准模式：浏览器根据W3C组织制定的标准网页规范来显示页面。
怪异模式：页面将以IE5显示页面的方式来呈现网页，以保证与过去非标准网页的兼容性。
它们最大的区别是对盒模型解析的差异。
Firefox从1.0以上版本开始支持3种显示模式：Quirks Mode、Almost Standards Mode (几乎标准模式)和Standards Mode。
其中Almost Standards Mode对应于IE和Opera的Standards Mode，该模式除了在处理表格方式方面有一些细微的差异之外，与标准模式基本相同。
火狐的显示模型细节差异可以参考：http://www.mozilla.org/docs/web-developer/quirks/doctypes.html
Opera从6.0版本开始支持与IE相同的显示模式：Quirks Mode 和 Standards Mode,关于显示模式的细节说明可以参考：http://www.opera.com/doc/specs/doctype/。
相关文档类型，根据文档类型进行显示：
HTML4.0过滤型：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
网页将遵循W3C制定的标准进行解析。
HTML4.0严格型：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
HTML4.0框架型：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML4.0 Frameset//EN" "http://www.w3.org/TR/REC-html40/frameset.dtd">
以及XHML1.0过渡型、XHTML1.0严格型、XHTML框架型3个文档类型，但如果不给网页定义文档类型，IE浏览器会以怪异模式显示网页。
没有提供文档类型的版本：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML//EN" "http://www.w3.org/TR/html/loose.dtd">
HTML2.0版本：
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML2.0//EN">
HTML3.0版本：
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML3.0//EN">
HTML3.2版本：
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML3.2Final//EN">
注意： 本示例仅在IE6.0以上版本浏览器有效，其他浏览器不支持此示例的显示差异。
条件过滤样式：
语法：<!--[if IE]> <![endif]-->
详解说明：
条件修饰关键字：
lte：小于或等于某个版本的IE浏览器。
lt：小于某个版本的IE浏览器。
gte：大于或等于某个版本的浏览器。
gt：大于某个版本的IE浏览器。
!：不等于某个版本的IE浏览器。
相关示例：
<!--[if IE5.0]>
<h1>只有IE5.0可以识别</h1>
<![endif]-->
<!--[if IE5]>
<h1>仅IE5.0和IE5.5可以识别</h1>
<![endif]-->
<!--[if IE6]>
<h1>仅IE6可以识别</h1>
<![endif]-->
<!--[if it IE6]>
<h1>IE6以及IE6以下版本可以识别</h1>
<![endif]-->
<!--[if IE5.5000]>
<h1>只有IE5.5可以识别</h1>
<![endif]-->
<!--[if gte IE6]>
<h1>IE6及以上版本可以识别</h1>
<![endif]-->
<!--[if IE7]>
<h1>仅IE7可以识别</h1>
<![endif]-->
<!--[if it IE7]>
<h1>IE7以及IE7以下版本可以识别</h1>
<![endif]-->
<!--[if gte IE7]>
<h1>IE7以及IE7以上版本可以识别</h1>
<![endif]-->
如果为某个版本的IE浏览器定义样式，则可以把样式放置在IE条件语句中。
例如：
<!--[if IE6]>
<style type="text/css">
body {
background：#00FFFF;
}
</style>
<![endif]-->
同时还可以为不同版本浏览器定义不同的外部样式表，再用IE条件语句为不同版本的IE浏览器导入不同的文件，从而实现浏览器的兼容性处理。
如：
<!--[if IE6]>
<link href="image/ie6.css" rel="stylesheet" type="text/css">
<![endif]-->
<!--[if IE7>
<link href="image/ie6.css" rel="stylesheet" type="text/css">
<![endif]-->
提示：利用IE条件语句可以设计专门为非IE浏览器使用的条件语句（请注意其特殊写法）。
<!--[if ！IE]>
<h1>除IE外都可识别</h1>
<![endif]-->
选择器过滤样式：
- 使用!important提升优先级：IE6以及以下版本的浏览器无法识别，IE7无法使用这种方法 。
- 使用下划线属性名：在IE7中被视为自定义属性，在CSS中无法识别并应用在IE7以上浏览器。IE6及以下版本可以识别。
- 使用*html选择符：在IE7浏览器中被忽略，专用于IE6及以下版本浏览器。
在标准网页中，html元素被认为根元素，其他元素都被包括其中。但是在IE6及以下版本的浏览器中默认一个匿名根元素，html元素被认为是它的子元素。
过滤声明：
- 隐藏单个声明：
IE6环境，如：
div {
width：200px;
width/**/：400px;
}
注意，注释的位置是在属性的后面，冒号的前面，且与属性名中间隔一个空格。
IE5.5环境，如：
div {
width：200px;
width： /**/400px;
}
注意，注释的位置是在冒号的后面，且与冒号中间隔一个空格。
IE5环境，如：
div {
width：200px;
width/* */：400px;
}
注意，注释的位置是在属性名的后面，冒号的前面，且注释中间隔一个空格。这个过滤器同时会适应Mac系统中的IE5和IE4。
如：
div {
width：200px;
width/**/：400px;
}
它不仅适用上面系统中的IE版本，也适用IE5.2/OS操作系统的浏览器版本。
- 隐藏多个声明：
利用voice-family属性设计兼容IE5.5及更低版本浏览器的声明。
如：
div,content {
height：400px;
width：400px;
border：solid 1px blue;
voice-family："\"}"\";
voice-family：inherit;
height：200px;
width：200px;
border：solid 1px red;
}
注意：
voice-family属性可以指定网页内容用哪种声音进行朗读，适用于盲人阅读器等设备上。
IE5.5及更低版本浏览器中由于不能够识别，同时错误解析转义字符，并认为到voice-family："\"}"\";这句结束。
其他浏览器中显示为200像素的红色框。
- 使用推荐过滤器：
IE6及更低版本专用：
*html #Element {
color：red;
...
}
IE7版本专用：
*+html #Element {
color：red;
...
}
IE7+及符合现代标准浏览器专用：
div>#Element {
color：red;
...
}
非IE现代标准浏览器专用：
html>/**/body #Element {
color：red;
...
}
\9：选择IE6+
\0：选择IE8+和Opera15以下的浏览器
如：
.test {
color: #090\9; /* For IE8+ */
*color: #f00; /* For IE7 and earlier */
_color: #ff0; /* For IE6 and earlier */
}使用检测工具：
W3C CSS验证服务：http://jigsaw.w3.org/css-validator/
Web Developer工具下载地址：http://chrispederick.com/work/webdeveloper。
