1.5 跨浏览器的CSS
由于W3C标准的发展及浏览器厂商出于商业利益的考量，使得低版本的浏览器（尤其是IE浏览器）存在着大量和W3C标准不一致的情况。一个在Chrome浏览器中显示效果十分美观的网站，在IE6中浏览很可能惨不忍睹，对此我们不得不进行大量的兼容性设计。
1.5.1 渐进增强与优雅降级
首先思考一个问题：网站页面是否需要在每个浏览器中看起来都是一样的？带着这个问题来看渐进增强。
渐进增强并不是一种技术，而是一种开发的方式，更是一种Web设计理念。在制作Web页面时，首先需要保证网站最核心功能的实现，让任何低端的浏览器都能够看到网站内容，然后再考虑使用高级但非必要的CSS和JavaScript等增强功能，为高版本的浏览器提供更好的支持，给用户带来更好的体验。
在设计的时候，先考虑低端设备用户能否看到所有内容，然后在此基础上为高端用户进行设计。不仅要为高端设备用户提供完美的应用，也要为不同性能级别设备的用户设计不同级别的不那么完美的应用，这称为“优雅降级”。
目前而言，虽然对“渐进增强”有所了解的人很多，但是还远远没有普及或深入。在大家平时的设计思维中有一种极强的固定思维，也就是想让网站页面在每一个浏览器中表现效果一致。这种出发点本身并没有什么问题，但是这样会让高版本浏览器的优势无法充分显示出来。
因此，从今天开始要改变制作网站的思维，让网站能够优雅降级，目标是“为尽可能多的用户提供尽可能优质的用户体验”。这与用户访问网站使用的方式无关，无论是通过传统的电脑、还是通过智能移动设备，用户都能够得到尽可能独特且完美的体验。
1.5.2 跨浏览器适配的通用方法
根据不同的开发需求，跨浏览器设计有多种解决方案，如果仅仅是要求在低版本IE浏览器中能够正常显示页面布局和内容，可以采用渐变增强的设计，仅使用一套代码，在布局方面采用一些兼容性的措施，保证不出现布局错乱即可。
而如果要保证所有的浏览器显示效果一致的话，一方面不得不放弃一些很炫酷的效果，如使用CSS3实现的元素变形与动画效果；另一方面不得不使用更多的图片，降低页面加载的性能；甚至我们可能必须针对不同的浏览器编写多套代码。
兼容性问题五花八门，这里先向大家介绍一种通用的方法，那就是通过条件注释让不同的浏览器加载不同的CSS样式，示例代码如下。
<!--[if IE]> 所有的IE浏览器都可以识别 <![endif]-->
<!--[if IE6]> 仅IE6浏览器可以识别 <![endif]-->
<!--[if lte IE6]> IE6及IE6以下版本浏览器可以识别 <![endif]-->
<!--[if get IE6]> IE6及IE6以上版本浏览器可以识别 <![endif]-->
<!--[if ! IE]><!--> 除IE浏览器以外都可以识别 <!--<!--[endif]-->
条件注释的控制符说明见表1-2。
表1-2 条件注释的控制符说明
