第2章CSS选择器与相关特性综述.ppt

2.3.4　导入式 导入式样式表与链接式样式表的功能基本相同，只是语法和运作方式上略有区别。采用import方式导入的样式表，在HTML文件初始化时，会被导入到HTML文件内，作为文件的一部分，类似内嵌式的效果。而链接式样式表则是在HTML的标记需要格式时才以链接的方式引入。 在HTML文件中导入样式表，常用的有如下几种@import语句，可以选择任意一种放在 与 标记之间。 @import url sheet1.css ; @import url sheet1.css ; @import url sheet1.css ; @import sheet1.css; @import sheet1.css; @import sheet1.css; 2.4　复合选择器 2.3节介绍了3种基本的选择器，以这3种基本选择器为基础，通过组合，还可以产生更多种类的选择器，实现更强、更方便的选择功能，复合选择器就是由基本选择器通过不同的连接方式构成的。 复合选择器就是两个或多个基本选择器，通过不同连接方式而成的选择器。 2.4.1　交集选择器 交集选择器由两个选择器直接连接构成，其结果是选中二者各自元素范围的交集。其中第1个必须是标记选择器，第2个必须是类别选择器或者是ID选择器。这两个选择器之间不能有空格，必须连续书写。 这种方式构成的选择器，将选中同时满足前后二者定义的元素，也就是前者所定义的标记类型，并且指定了后者的类别或者id的元素，因此被称为交集选择器。例如，声明了p、.special和p.special这3种选择器。 标记类别选择器 交集选择器示意图 2.4.2　并集选择器 与交集选择器相对应，还有一种并集选择器，或者称为“集体声明”。它的结果是同时选中各个基本选择器所选择的范围。任何形式的选择器（包括标记选择器、class选择器、ID选择器等）都可以作为并集选择器的一部分。 并集选择器是由多个选择器通过逗号连接而成的。在声明各种CSS选择器时，如果某些选择器的风格是完全相同的，或者部分相同，就可以利用并集选择器同时声明风格相同的CSS选择器。 并集选择器示意图 2.4.3　后代选择器 在CSS选择器中，还可以通过嵌套的方式对特殊位置的HTML标记进行声明，如当 与 之间包含 标记时，就可以使用后代选择器进行相应的控制。后代选择器的写法就是把外层的标记写在前面，内层的标记写在后面，之间用空格分隔。当标记发生嵌套时，内层的标记就称为外层标记的后代。 嵌套选择器 2.5　CSS的继承特性 本节进一步讲解后代选择器的应用，它将会贯穿在所有的设计中。若之前学过面向对象语言，那么对于继承（Inheritance）的概念一定不会陌生。在CSS中的继承并没有像在C++和Java等语言中那么复杂，简单地说，就是将各个HTML标记看作一个个容器，其中被包含的小容器会继承包含它的大容器的风格样式。本节从页面各个标记的父子关系出发，详细地讲解CSS的继承。 2.5.1　继承关系 在这个树形关系中，处于最上端的 标记称之为“根（root）”，它是所有标记的源头，往下层层包含。在每一个分支中，称上层标记为其下层标记的“父”标记；相应地，下层标记称为上层标记的“子”标记。例如， 标记是 标记的子标记，同时它也是 的父标记。 继承关系树形图 2.5.2　CSS继承的运用 CSS继承指的是子标记会继承父标记的所有样式风格，并可以在父标记样式风格的基础上再加以修改，产生新的样式，而子标记的样式风格完全不会影响父标记。 父子关系示例 2.6　CSS的层叠特性 CSS的层叠特性很重要，并且要注意，不要和前面介绍的“继承”相混淆，二者有着本质的区别。实际上，层叠可以简单地理解为“冲突”的解决方案。 层叠特性示意 小结 本章介绍CSS规则的定义方法，即CSS规则是如何由选择器、属性和属性值三者构成的。然后介绍了选择器的含义和作用。 第2章 CSS选择器与相关特性 本章简介： 通过上一章的学习，了解了在网页设计中引入CSS的意义。引入CSS的核心目的就是实现网页结构内容和表现形式的分离，将原来由HTML语言所承担的一些与结构无关的功能剥离出来，改由CSS来完成。 本章介绍CSS是如何工作的。重点介绍CSS的“选择器”这一核心概念，以及相关的两个特性——“继承”和“层叠”。 构造CSS规则 2.1 基本CSS选择器 2.2 在HTML中使用CSS的方法 2.3 复合选择器 2.4 CSS的继承特性 2.5 CSS的层叠特性 2.6 2.1　构造CSS规则 CSS的作用就是设置网页的各个组成部分的表现形式。因此，如果把上面的表格换成描述网页上一个标题的属性表，可以设想应该大致如下： 2级标题 h2 字体:宋体; font-family: 宋体; 大小:15像