2.1 认识CSS

CSS指层叠样式表（Cascading Style Sheets），对于设计者来说，CSS是一个非常灵活的工具，使用户不必再把复杂的样式定义编写在文档结构当中，而将有关文档的样式内容全部脱离出来。这样做的最大优势就是在后期维护中只需要修改相应的代码即可。

2.1.1 CSS功能

随着Internet的不断发展，用户对页面效果的需求越来越强烈，只依赖HTML这种结构化标记，实现样式已经不能满足网页设计者的需要。其表现有以下几个方面。

（1）维护困难。为了修改某个特殊标记格式，需要花费很多时间，尤其对整个网站而言，后期修改和维护成本较高。

（2）标记不足。HTML本身标记十分少，很多标记都是为网页内容服务，而关于内容样式标记，例如文字间距、段落缩进很难在HTML中找到。

（3）网页过于臃肿。由于没有统一对各种风格样式进行控制，HTML页面往往体积过大，占用掉很多宝贵的空间。

（4）定位困难。在整体布局页面时，HTML对于各个模块的位置调整显得捉襟见肘，过多的table标记将会导致页面的复杂和后期维护的困难。

在这种情况下，就需要寻找一种可以将结构化标记与丰富的页面表现相结合的技术。CSS样式技术就产生了。

CSS称为层叠样式表，也可以称为CSS样式表或样式表，其文件扩展名为.css。CSS是用于增强或控制网页样式，并允许将样式信息与网页内容分离的一种标记性语言。

引用样式表的目的是将“网页结构代码”和“网页样式风格代码”分离开，从而使网页设计者可以对网页布局进行更多的控制。利用样式表，可以将整个站点上所有网页都指向某个CSS文件，设计者只需要修改CSS文件中的某一行，整个网页上对应的样式就会随之发生改变。

2.1.2 浏览器与CSS

CSS制定完成之后，具有了很多新功能，即新样式。但这些新样式在浏览器中不能获得完全支持。主要在于各个浏览器对CSS很多细节处理上存在差异，例如某个标记的属性有些浏览器支持，而有些浏览器不支持，或者虽然两种浏览器都支持，但是其显示效果却不一样。

各主流浏览器，为了自己产品的利益和推广，定义了很多私有属性，以便加强页面显示样式和效果，导致现在每种浏览器都存在大量的私有属性。虽然使用私有属性可以快速构建效果，但是对网页设计者却是一个很大的麻烦，设计一个页面，就需要考虑在不同浏览器上显示的效果，一不注意就会导致同一个页面在不同浏览器上的显示效果不一致。甚至有的浏览器不同版本之间，也具有不同的属性。

如果所有浏览器都支持CSS样式，那么网页设计者只需要使用一种统一标记，就会在不同浏览器上显示同一样式效果。

当CSS被所有浏览器接受和支持的时候，网页设计将会变得非常容易，其布局更加合理，样式更加美观，到那个时候，整个Web页面显示会焕然一新。虽然现在CSS还没有完全普及，各个浏览器对CSS的支持还处于发展阶段，但CSS是一个新的、发展潜力很大的技术，在样式修饰方面，是其他技术无可替代的。此时学习CSS技术，才能保证技术不落伍。

2.1.3 CSS发展历史

万维网联盟（W3C）是一个非营利的标准化联盟，在1996年制定并发布了一个网页排版样式标准，即层叠样式表，用来对HTML有限的表现功能进行补充。

随着CSS的广泛应用，CSS技术越来越成熟。CSS现在有三个不同层次的标准，CSS1、CSS2和CSS3。

CSS1（CSS Level 1）是CSS的第一层次标准，它正式发布于1996年12月17日，1999年1月11日进行了修改。该标准提供简单的样式表机制，使网页的编者通过附属的样式对HTML文档的表现进行描述。

CSS2（CSS Level 2）于1998年5月12日被正式作为标准发布，CSS2基于CSS1，包含了CSS1的所有特色和功能，并在多个领域进行完善，将表现样式文档和文档内容进行分离。CSS2支持多媒体样式表，使得我们能够根据不同的输出设备给文档制定不同的表现形式。

2001年5月23日，W3C完成了CSS3的工作草案，在该草案中制订了CSS的发展路线图，详细列出了所有模块，并计划在未来逐步进行规范。在以后的时间内，W3C逐渐发布了不同模块。

CSS1主要定义了网页的基本属性，如字体、颜色、空白边等。CSS2在此基础上添加了一些高级功能，如浮动和定位，以及一些高级的选择器，如子选择器、相邻选择器和通用选择器等。CSS3开始遵循模块化开发，这将有助于厘清模块化规范之间的不同关系，减少完整文件的大小。以前的规范是一个完整的模块，结构庞大，而且比较复杂，所以，新的CSS3规范将其分为了多个模块。