CSS选择器

标签：ack   重要   选中   方式   列表项   gen   不同   红色   red   

　　CSS选择器的准确书写，保证了元素应用样式的正确性，CSS中选择器主要包括：

1、元素选择器：

　　最常见的 CSS 选择器是元素选择器。换句话说，文档的元素就是最基本的选择器。元素选择器又称为类型选择器（type selector）。类型选择器匹配文档语言元素类型的名称。类型选择器匹配文档树中该元素类型的每一个实例。如果设置 HTML 的样式，选择器通常将是某个 HTML 元素，比如 p、h1、em、a，甚至可以是 html 本身：

html {color:black;}
h1 {color:blue;}
p {color:silver;}

2、类选择器：

　　类选择器允许以一种独立于文档元素的方式来指定样式。该选择器可以单独使用，也可以与其他元素结合使用。只有适当地标记文档后，才能使用这些选择器，所以使用这两种选择器通常需要先做一些构想和计划。要应用样式而不考虑具体设计的元素，最常用的方法就是使用类选择器。

　　如有这样一段HTML代码：

<h1 class="important">
This heading is very important.
</h1>

<p class="important">
This paragraph is very important.
</p>

　　如果只想选择所有类名相同的元素，可以在类选择器中忽略元素选择器：

.important {color:red;}
或者
*.important {color:red;}

　　只想选中p时，类选择器可以结合元素选择器来使用，选择器现在会匹配 class 属性包含 important 的所有 p 元素，但是其他任何类型的元素都不匹配，不论是否有此 class 属性。选择器 p.important 解释为：“其 class 属性值为 important 的所有段落”。 因为 h1 元素不是段落，这个规则的选择器与之不匹配，因此 h1 元素不会变成红色文本。：

p.important {color:red;}

　　通过把两个类选择器链接在一起，仅可以选择同时包含这些类名的元素（类名的顺序不限）。如果一个多类选择器包含类名列表中没有的一个类名，匹配就会失败。

.important.urgent {background:silver;}

　　这段代码在以下元素中不能显示：

<p class="important warning">
This paragraph is a very important warning.
</p>

　　但是在下面的元素中就能实现：

<p class="important urgent warning">
This paragraph is a very important and urgent warning.
</p>

3、id选择器

　　在某些方面，ID 选择器类似于类选择器，不过也有一些重要差别。首先，ID 选择器前面有一个 # 号 - 也称为棋盘号或井号。第二个区别是 ID 选择器不引用 class 属性的值，毫无疑问，它要引用 id 属性中的值。

　　类选择器可以为任意多个元素指定类。前一章中类名 important 被应用到 p 和 h1 元素，而且它还可以应用到更多元素。

　　与类不同，在一个 HTML 文档中，ID 选择器会使用一次，而且仅一次。

　　不同于类选择器，ID 选择器不能结合使用，因为 ID 属性不允许有以空格分隔的词列表。

　　类似于类，可以独立于元素来选择 ID。有些情况下，您知道文档中会出现某个特定 ID 值，但是并不知道它会出现在哪个元素上，所以您想声明独立的 ID 选择器。例如，您可能知道在一个给定的文档中会有一个 ID 值为 mostImportant 的元素。您不知道这个最重要的东西是一个段落、一个短语、一个列表项还是一个小节标题。您只知道每个文档都会有这么一个最重要的内容，它可能在任何元素中，而且只能出现一个。

4、

CSS选择器

标签：ack   重要   选中   方式   列表项   gen   不同   红色   red   

原文地址：http://www.cnblogs.com/zzmiaow/p/7748644.html