网页排版CSS教学第三章 ＣＳＳ的运用补充
日期：2013-11-07 浏览次数：21252 次
第三章 ＣＳＳ的使用补充
挑 选 者 特 性 的 应 用
在讲挑选者的特性之前，要提一下的是ＣＳＳ承继的特性。所谓的承继的特性是指被包在内部的标签将拥有外部标签的款式性质。承继的特性最典型的使用通常发挥在预设整份网页的款式，而要指定为其它款式的部份再依要设定在一般元素里即可。这项特性可以提供网页设计者更理想的发挥空间。
接下来就要讲挑选者特性的使用！其实这部份应该算是声明的一种方式，但是在您看过第二章的基本的声明与使用後，到这边再讲挑选者您会比较有概念点。在ＣＳＳ使用或设计的时候，有几种依据元素的关系或性质来设定显示特定性质的方法，就是挑选者特性的使用，能让您在控制与使用上愈加灵活。
一、前後文挑选者：依声明标签前後文关系显示特定性质的方法。
前後文挑选者便是当浏览器在显示HTML原始码所指定的内容时，会考虑元素标签的前後关系，而去显示指定的款式声明。也就是说只需HTML原始码内的标签陈列前後顺序符合时，该项声明便会发生作用了！
元素A(标签A) 元素B(标签B) 元素C(标签C) ... {款式规则}
要留意的是，前後文挑选者的声明跟集体声明很像，但是集体声明的元素标签间要用逗号隔开，而用前後文挑选者声明时元素标签间要用空格隔开；而这两种声明方式您可以混合使用。
元素A 元素B, 元素C 元素D 元素E, ... {款式规则}
这样您就可以用集体声明的方式，声明数组前後文挑选者的款式规则。
二、类别挑选者：让单一或数个标签使用同组款式规则的方法。
类别(class)可以让不同的元素标签共同套用同一组款式性质或相反的元素标签套 用不同组的款式性质。首先引见的是如何让不同的元素套用同一组款式性质，如下面范例所写即可。
...
...
...
...
...
要留意在声明时前面的小点，CLASS名称可任取。而要让相反的元素标签套用不同组的款式性质时，也可以使用类别特性来设定。
...
...
...
...
...
要留意同样是在声明时的小点，CLASS名称可任取。灵活运用类别特性，可以让您的款式设定更具机动性唷！
三、ＩＤ挑选者：与类别挑选者类似，不同的是在『独一性』。
ＩＤ特性的使用与类别特性十分雷同，但是，文件里的各个ＩＤ都是独一的。换句话 说，类别特性可以反复套用在单一或数个元素标签之上，但是ＩＤ属性在一份文件里只能出现一次。如下面范例所写即可。
...
...
...
可以看到，声明的方式是利用井字号『#』。而ＩＤ的这种『独一性』正是让javascript或 VBScript能够对元素进行控制的关键。
透过以上的引见的挑选者特性的声明与使用，可以让您的款式设定更具机动与变化 。其实您可以先熟悉上一章为您引见的基本的声明与使用方法，再使用本章所讲的挑选者特性，一步步地去熟悉款式表的使用。
结 拟 似 特 性 的 应 用
还记得在HTML的基本语法，在BODY标签中可 以用link、alink、vlink属性去控制可连结或已连结的字体颜色吗？如今亦可用ＣＳＳ去控制这些性质，称为『拟似类别』（pseudo class）。您可以将其当作普通类别，声明其款式规则，而实际上，这些拟似类别并不用像上面讲的类别挑选者，在HTML原始码中再 行设定指向的类别（CLASS）。下面引见拟似类别的声明与使用。
普通的声明方式：拟似类别是以冒号来声明。
只需在 架构中加入下面的声明後，则页面中的连结文字就会依您设定的款式显式了！
A:link { 款式 规则 }
A:active { 款式规则 }
A:visited { 款式规则 }
A:hover { 款式规 则 }
A:link用以设定未参观连结的款式规则。A:active用以设定作用中连结的款式规则。A:visited用以设定已参观连结的款式规则。A:hover用以设定滑鼠移到 连结之上时的款式规则。而其中hover并不被NC4所援助，其它三个特性两大浏览器都有支持。
如果您用的是IE4以上的浏览器，从本站链接您就可以知道 hover作用的妙处，以简单的款式设定就可以达成以往要写好长一串设定的相反效果 。这个连结拟似类别也可以与上面说过的类别挑选者特性合并使用。
Ｄ Ｉ Ｖ 与 Ｓ Ｐ Ａ Ｎ 的 比 较
虽然款式表可以套用在任何标签之上，但是 ＤＩＶ和ＳＰＡＮ元素的使用更是大大地扩展了HTML的使用层面。ＤＩＶ和ＳＰＡＮ这 两个元素在使用上十分类似，使用时都必加上结尾标签，也就是< DIV>...
和... 。两个可以使用的属性与事件处理也很类似，都可以配合前面提过的挑选者特性来编写。两者也都不强加显示功用于页面内容之上，可以说是使用上十分广泛的元素标签。而ＤＩＶ和ＳＰＡＮ的不同之处在于：ＤＩＶ元素定义为区块（block），在
