【关键词】CSS 选择器 基础语法规则 工作原理
一、引言
CSS是层叠样式表（Cascading Style Sheets）的缩写，用于定义HTML元素的显示形式，是W3C推出的格式化网页内容的标准技术，是网页设计者必须掌握的技术之一。在HTML文档中加入CSS样式表可分为嵌入式样式表、外部样式表和内联样式表三种，在同一文档内可以同时使用三种方法。
二、CSS选择器的基础语法规则
选择器是CSS语法中最重要最基本的概念。使用选择器可以指定XHTML文档中特定标签应用CSS样式。选择器有许多类型，包括标签选择器、类选择器、ID选择器、全局选择器、组合选择器、继承选择器和伪类选择器等。
（一）标签选择器。一个XHTML文档中有许多标签，例如p标签、h1标签等。若要使文档中的所有p标签都使用同一个CSS样式，就应使用标签选择器。如代码“h1 {color：red； font-size：14px；}”，这行代码的作用是将 h1元素内的文字颜色定义为红色，同时将字体大小设置为14像素。在这个例子中，h1是选择器，color和 font-size是属性，red和14px是值。标签选择器可以直接改变该标签的所有样式。
（二）类选择器。使用标签选择器可以为整个XHTML文档中的同一个标签指定相同的CSS样式，但是在实际运用中，XHTML文档中的同一个标签会被反复使用，若要为相同的标签赋予不同的CSS样式就应使用类选择器。以下是使用类选择器定义CSS样式的步骤：（1）编写合适的类选择器名，然后定义CSS样式声明，例如定义类选择器名为news的CSS样式代码.news{ font-size：20px；color：green }。（2）把以news为名的CSS样式应用到XHTML某个指定的标签中。将news样式指定给标签的方法如下：
新闻，其中，在
中写入class=“news”的语句。Class和等号都是固定的写法，在双引号中写入类选择器的名称。
（三）ID选择器。ID选择器和类选择器相似，不同的是，ID选择器不能复用。在一个XHTML文档中，一个ID选择器只能把其CSS样式指定给一个标签。以下是使用ID选择器定义CSS样式的步骤：（1）编写合适的类选择器名，然后定义CSS样式声明，以下是定义类选择器名为special的CSS样式代码：#special{ font-size：20px；color：green }。（2）把以special为名的CSS样式应用到XHTML某个指定的标签中。将news样式指定给标签的方法如下：
特别报道，其中，在
中写入id=“special”的语句。ID和等号都是固定的写法，在双引号中写入ID选择器的名称。
（四）全局选择器。全局选择器是一个星号。它能作用于XHTML文档中的所有元素。图为全局选择器的结构。对于全局选择器还有一个不得不提的用法，就是为了保证做出的页面能够兼容多种浏览器，所以要对HTML内的所有标签进行重置，会将下面的代码加到CSS文件的最顶端，如：
*{marging：0；padding：0}因为HTML4.01中有89个标签，所以相当于在页面加载CSS的时候，先对这89个标签都加上了{margin：0；padding：0；}，在这里我不建议大家这么做，因为89个标签中需要重置的标签是很少数，没有必要将所有的标签都重置，需要哪些标签重置就让哪些标签重置就可以了，如下：body，div，p，a，ul，li{marging：0；padding：0}，用到那些就写那些，这点也可以看作衡量页面重构师制作页面水平的高低以及是否专业的一个方面。
（五）组合选择器。标签选择器、类选择器和ID选择器是可以组合起来使用的。一般的组合方式是标签选择器和类选择器组合，标签选择器和ID选择器组合。这两种组合方式的原理和效果是一样的。组合选择器只是一种组合形式，并不算是一种真正的选择器，但在实际中经常使用。
（六）伪类选择器。伪类选择器可以以不同方式格式化超级链接元素的四种不同状态：以下顺序依次写：（记忆方法：a Love or Hate）a：link 是用在未访问的链接的选择器；a：visited 是用在已访问过的链接的选择器；a：hover是用在鼠标光标放在其上的链接的选择器；a：active 是用在获得焦点（比如：被点击）的链接的选择器。如果需要，我们可以组合这几个状态，按顺序写：a：link，a：visited { color：blue；}；a：hover，a：active { color：blue；}。
（七）继承选择器
学习使用继承选择器就必须先了解文档树和CSS的继承。每个XHTML都可以被看作一个文档树，文档树的根部就是html标签，而head和body标签就是其子元素。在head和body里的其他标签就是html标签的子孙元素。整个XHTML就呈现一种祖先和子孙的树状关系。CSS的继承是指子孙元素继承祖先元素的某些属性。
三、使CSS在XHTML文档中生效，即CSS的调用
在创建一个标准的XHTML页面后，就要使用CSS样式控制XHTML文档的表现。使CSS样式表在一个XHTML文档中生效的方法有许多种。以下将讲述各种嵌入CSS样式表的方法。有三种方法，可以在站点网页上使用样式表：1.外联式Linking（也叫外部样式），将网页链接到外部样式表；2.嵌入式Embedding（也叫内页样式），在网页上创建嵌入的样式表；3.内联式Inline（也叫行内样式），应用内嵌样式到各个网页元素。其中，优先级顺序为：内联式>嵌入式> 外联式。本人推荐使用第一种调用方法（外部调用法）。
四、CSS总结
CSS就是一种叫作样式表（stylesheet）的技术。它的作用可以达到：（1）在几乎所有的浏览器上都可以使用；（2）以前一些非得通过图片转换实现的功能，现在只要用CSS就可以轻松实现，从而更快地下载页面；（3）使页面的字体变得更漂亮，更容易编排，使页面真正赏心悦目；（4）你可以轻松地控制页面的布局；（5）你可以将许多网页的风格格式同时更新，不用再一页一页地更新了。
【参考文献】
[1]曾顺.精通CSS DIV网页样式与布局[M].北京：人民邮电出版社，2007.
[2]王俭敏.CSS DIV网页样式与布局案例指导[M].北京：电子工业出版社，2009.
[3]曾静娜.新手学CSS DIV[M]北京：北京希望电子出版社，2010.