程序员好Web前端教程分享CSS派生选择器详解

CSS高级语法CSSidSelector派生选择器你可以根据元素所在位置的上下文来定义样式，让你的标记更加简洁。在CSS1中，以这种方式应用规则的选择器称为上下文选择器，因为它们依赖于上下文来应用或避免规则。在CSS2中，它们被称为派生选择器，但无论您如何称呼它们，它们的作用都是一样的。派生选择器允许您根据文档的上下文来设置标签的样式。通过明智地使用派生选择器，我们可以使HTML代码更加简洁。例如，如果您希望列表中的强元素显示为斜体而不是通常的粗体，您可以像这样定义一个派生选择器：listrong{font-style:italic;font-weight:normal;}注意标记上下文蓝色代码为：

我是粗体，不是斜体，这条规则对我不起作用，因为我不在列表中

1. 我是斜体。这是因为strong元素在li元素内部。
2. 我是普通字体。

上面的例子中只是li元素中strong元素的样式为斜体，不需要为strong元素定义专门的class或者id，代码更加简洁。再看看下面的CSS规则：strong{color:red;}h2{color:red;}h2strong{color:blue;}下面是它影响的HTML：

本段中强调的词是红色。

这个小标题也是红色的。

这个小标题中强调的词是蓝色的。