|
|
马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。
您需要 登录 才可以下载或查看，没有帐号？立即注册
x
表现和内容相分离。将设计部分剥离出来放在一个独立样式文件中，你可以减少未来网页无效的可能。
<P>在讲选择者的特征之前，要提一下的是ＣＳＳ承继的特征。所谓的承继的特征是指被包在外部的标签将具有内部标签的款式性子。承继的特征最典范的使用一般发扬在预设整份网页的款式，而要指定为别的款式的部分再依要设定在一般元素里便可。这项特征能够供应网页计划者更幻想的发扬空间。
接上去就要讲选择者特征的使用！实在这部分应当算是声明的一种体例，可是在您看过第二章的基础的声明与使用後，到这边再讲选择者您会对照有观点点。在ＣＳＳ使用或计划的时分，有几种根据元素的干系或性子来设定显现特定性子的办法，就是选择者特征的使用，能让您在把持与使用上加倍天真。
1、前後文选择者：依声明标签前後文干系显现特定性子的办法。
前後文选择者即是当扫瞄器在显现HTML原始码所指定的内容时，会思索元素标签的前後干系，而往显现指定的款式声明。也就是说只需HTML原始码内的标签分列前後按次切合时，该项声明便会产生感化了！
元素A(标签A)元素B(标签B)元素C(标签C)...{款式划定规矩}
要注重的是，前後文选择者的声明跟个人声明很像，可是个人声明的元素标签间要用逗号离隔，而用前後文选择者声明时元素标签间要用空格离隔；而这两种声明体例您能够夹杂利用。
元素A元素B,元素C元素D元素E,...{款式划定规矩}
如许您就能够用个人声明的体例，声明数组前後文选择者的款式划定规矩。
2、种别选择者：让单一或数个标签利用同组款式划定规矩的办法。
种别(class)可让分歧的元素标签配合套用统一组款式性子或不异的元素标签套用分歧组的款式性子。起首先容的是怎样让分歧的元素套用统一组款式性子，以下面典范所写便可。
<HTML>
<HEAD>
<STYLE>
<--
.blue{color:BLUE}
-->
</STYLE>
</HEAD>
<BODY>
...
<H1class="blue">...</H1>
...
<Pclass="blue">...</P>
...
</BODY>
要注重在声明时后面的小点，CLASS称号可任取。而要让不异的元素标签套用分歧组的款式性子时，也能够使用种别特征来设定。
<HTML>
<HEAD>
<STYLE>
<--
P.blue{color:BLUE}
P.red{color:RED}
-->
</STYLE>
</HEAD>
<BODY>
...
<Pclass="blue">...</P>
...
<Pclass="red">...</P>
...
</BODY>
要注重一样是在声明时的小点，CLASS称号可任取。天真使用种别特征，可让您的款式设定更具灵活性唷！
3、ＩＤ选择者：与种别选择者相似，分歧的是在『独一性』。
ＩＤ特征的利用与种别特征非常相同，可是，文件里的各个ＩＤ都是独一的。换句话说，种别特征能够反复套用在单一或数个元素标签之上，可是ＩＤ属性在一份文件里只能呈现一次。以下面典范所写便可。
<HTML>
<HEAD>
<STYLE>
<--
#blue{color:BLUE}
-->
</STYLE>
</HEAD>
<BODY>
...
<PID="blue">...</P>
...
</BODY>
能够看到，声明的体例是使用井字号『#』。而ＩＤ的这类『独一性』恰是让javascript或VBScript可以对元素举行把持的关头。
透过以上的先容的选择者特征的声明与利用，可让您的款式设定更具灵活与变更。实在您能够先熟习上一章为您先容的基础的声明与使用办法，再使用本章所讲的选择者特征，一步步地往熟习款式表的利用。
连 结 拟 似 特 性 的 应 用
还记得在HTML的基础语法，在BODY标签中可以用link、alink、vlink属性往把持可保持或已保持的字体色彩吗？如今亦可用ＣＳＳ往把持这些性子，称为『拟似种别』（pseudoclass）。您能够将其看成一样平常种别，声明其款式划定规矩，而实践上，这些拟似种别其实不用像下面讲的种别选择者，在HTML原始码中再行设定指向的种别（CLASS）。上面先容拟似种别的声明与使用。
一样平常的声明体例：拟似种别是以冒号来声明。
只需在<STYLE>...</STYLE>架构中到场上面的声明後，则页面中的保持笔墨就会依您设定的款式显式了！
A:link{款式划定规矩}
A:active{款式划定规矩}
A:visited{款式划定规矩}
A:hover{款式规则}
A:link用以设定未观光保持的款式划定规矩。A:active用以设定感化中保持的款式划定规矩。A:visited用以设定已观光保持的款式划定规矩。A:hover用以设定滑鼠移到保持之上时的款式划定规矩。而个中hover其实不被NC4所增援，别的三个特征两年夜扫瞄器都有撑持。
假如您用的是IE4以上的扫瞄器，从本站链接您就能够晓得hover感化的妙处，以复杂的款式设定就能够告竣以往要写好长一串设定的不异效果。这个保持拟似种别也能够与下面说过的种别选择者特征兼并利用。
Ｄ Ｉ Ｖ 与 Ｓ Ｐ Ａ Ｎ 的 比 较
固然款式表能够套用在任何标签之上，可是ＤＩＶ和ＳＰＡＮ元素的利用更是年夜年夜地扩大了HTML的使用层面。ＤＩＶ和ＳＰＡＮ这两个元素在使用上非常相似，利用时都必加上开头标签，也就是<DIV>...</DIV>和<SPAN>...</SPAN>。两个能够使用的属性与事务处置也很相似，都能够共同后面提过的选择者特征来编写。二者也都不强加显现功效于页面内容之上，能够说是利用上非常普遍的元素标签。
而ＤＩＶ和ＳＰＡＮ的分歧的地方在于：ＤＩＶ元素界说为区块（block），在<DIV>...</DIV>之间是一个很完全的段落区块。而ＳＰＡＮ元素则是界说为同轴（in-line），<SPAN>...</SPAN>使用于于小局限内的设定。二者能够相互夹杂，同化利用，由于相互是互相自力的。也因而，您能够使用这两个元素，共同别的性子，天真地调剂您的网页显现的内容。
Table中布局中，垃圾代码会很多，一些修饰的样式及布局的代码混合一起，很不利于直观。而Div更能体现样式和结构相分离，结构的重构性强。 |
|
|Archiver|手机版|仓酷云
鄂ICP备14007578号-2
发表于 2015-1-16 00:17:59
收藏
转播
分享
淘帖
顶
踩
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
千斤顶
照妖镜