2.2.2 CSS 3的概念
前面介绍过使用元素的style属性控制HTML 5元素的样式，这种方式称为“内联式”，其优点是直观、方便。但缺点也十分突出，如果页面中有多个元素需要使用相同的样式，就需要进行多次书写，修改也十分麻烦。
串联样式表（Cascading Style Sheets，CSS），也称为级联样式表或层叠样式表，简称为样式表，是一种将页面元素样式设置集中化的方法，引入CSS的主要目的就是实现将页面结构与页面外观表现分离。CSS目前的最高版本是CSS 3，它较之前的版本有很大的改进。本书由于篇幅所限，所述内容仅包含了部分CSS 3的新特性，有兴趣的读者可自行参阅相关资料。
在设计由众多页面组成的网站时，设计页面外观样式会占据开发人员大量的时间，特别是网页设计完成后，各种颜色的搭配及不同页面的外观一致性要求往往会给后期维护工作带来较大的负担，而使用CSS则可以很好地解决这一问题。除了“内联式”，CSS还规定了“嵌入式”和“外部链接式”两种定义样式的方法。
1.嵌入式
所谓“嵌入式”样式控制，是将页面中所有样式控制代码集中放置在<head></head>标记之间，其语法格式如下。
选择器用于说明后面的样式设置对哪一部分起作用。选择器可以是网页中现有标记名称、ID和CSS类等。关于选择器的分类和使用方法将在后面进行详细介绍。
使用嵌入式样式定义方法，网页代码可书写成如下格式。
与内联式相比，嵌入式使代码简洁了许多，而且需要修改样式时只要修改<style></style>中的内容即可。但嵌入式的“集中控制”仅局限在当前网页中，无法将样式定义应用到整个网站包含的所有网页中。
2.外部链接式
所谓“外部链接式”样式控制，是将样式控制代码单独存放在一个以.css为扩展名的级联样式表文件内，再通过<link>标记引用其中对样式的定义。
（1）<link>标记
.css文件的内容就是嵌入式定义中<style>和</style>之间的样式定义部分，<link>标记的语法格式如下。
说明：rel属性是Relations的缩写，rel=＂stylesheet＂的含义是，将当前文档关联到一个级联样式表文件。href属性指示了被关联文件的名称，如果.css文件没有存放在当前目录中，应写出文件所在的URL（可以是本地站点，也可以是外部站点）。
显然，使用外部链接样式控制可以将样式定义应用到更为广泛的范围，这给结构复杂、页面众多的大型网站的设计带来了很大方便。
（2）样式定义的优先级
如果网页中既有内联式和嵌入式样式定义，又有外部链接式样式定义，而且这3种定义中还存在针对某特定元素的定义冲突，浏览器将采用“就近使用”的优先原则，即采用与该元素位置最近的样式定义。
显然，内联式样式定义在任何情况下都最靠近元素位置，所以其优先级是最高的，也就是说，内联式样式定义将覆盖嵌入式和外部链接式样式定义。而对于嵌入式和外部链接式样式定义的优先级，要看<link>标记和<style>标记哪一个更靠近元素的位置。
需要注意的是，前面谈到的“覆盖”只有在定义发生冲突时才会出现，如果低优先级和高优先级定义的内容没有冲突，则二者同时有效。例如，嵌入式样式定义中设置了文字的颜色和大小，而内联式样式定义仅设置了文字的大小，则文字大小由内联式样式定义决定，而颜色仍由嵌入式样式定义决定。