强烈推荐：非常不错的样式表CSS教程(1)(2)

，”连接合并到一起说明，示例：

h1 { background-color: #ffff00 }
h2 { background-color: #ffff00 }
h3 { background-color: #ffff00 }

上面的样式说明合并到一起，写法如下：

h1, h2, h3 { background-color: #ffff00 }

这种定义称为“群组”定义。注意同一标记可以再次设置，次数不限，例：

h1, h2, h3 { background-color: #ffff00 }
h1 { color: red }

HTML标识名是不区分大小写的，所以“H1”等价于“h1”，但是语法更加严格的XHTML中，标识名必须小写，所以最好有一个良好的书写习惯，建议在书写你的样式表时使用小写字母。

●Pattern Matching模式匹配

Selectors并不仅仅局限于标识名，事实上，有多种匹配模式可以定义元素的样式，甚至利用元素的属性来定义。

Internet Explorer现在还不能支持所有的selector的匹配模式。建议使用Netscape或者Opera来测试下面的演示。

列表中例举了Selectors不同的匹配模式和解释以及在线演示的示例链接。

模式	说明	演示
E	标准的selector、标识名E相配元素E
E F	Descendant selector, 如果E标记包含F时，匹配F
E>F	Child selector 、如果F是E的子标记，则匹配F
E F	Adjacent selector、如果E和F有相同的parent父标识同时F紧临着E，则匹配F

注意：其中" parent "、" child "、" descendant "、和" adjacent "这些名词涉及到文档内部的标记分级关系结构。举例来说明：

<div> <h3>What Good is CSS?</h3> <p>CSS gives you <i>very precise control</i> over how your web ages look. Use it to your advantage! </p> </div>

• H3标记和P标记是DIV标记的children子标记。
• H3、P 和I标记都是DIV标记的descendants后代
• H3 和 P 标记的父标记是DIV
• I标记是P的children子标记，它的parent标记是P
• I标记不是DIV标记的children子标记，它是DIV标记的grandchild标记或descendants标记
• DIV标记是H3、P 和I的ancestor源标记
• H3和P标记是adjacent相邻关系

Selector中还可以使用通用匹配符“*”：

h2 * { color: red }

将任何紧接着H2的任何元素显示为红色

关键词：

【推荐给好友】【关闭】

最新五条评论

查看全部评论

评论总数 0 条

您的评论

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有