CSS选择器（上）

CSS选择器（上）

在 CSS 中，选择器是选取需设置样式的元素的模式。

下面我们介绍几种常用选择器:

1.CSS 元素选择器

最常见的 CSS 选择器是元素选择器。换句话说，文档的元素就是最基本的选择器。

元素选择器:通过选择html标签设置css样式

示例：直接选取p标签设置文本颜色

 

2.类型选择器

在 W3C 标准中，元素选择器又称为类型选择器（type selector）。

“类型选择器匹配文档语言元素类型的名称。类型选择器匹配文档树中该元素类型的每一个实例。”

类选择器：通过设置class类设置css样式

注意：class命名不能以数字开头

示例：设置类名为change的标签中的文本颜色

 

3.CSS ID 选择器

在某些方面，ID 选择器类似于类选择器，不过也有一些重要差别。

语法

首先，ID 选择器前面有一个 # 号 - 也称为棋盘号或井号。

请看下面的规则：

*#intro {font-weight:bold;}

与类选择器一样，ID 选择器中可以忽略通配选择器。前面的例子也可以写作：

#intro {font-weight:bold;}

这个选择器的效果将是一样的。

第二个区别是 ID 选择器不引用 class 属性的值，毫无疑问，它要引用 id 属性中的值。

以下是一个实际 ID 选择器的例子：

<p id="intro">This is a paragraph of introduction.</p>

ID选择器：通过设置ID来设置css样式  

注意：ID命名不能以数字开头

示例：设置ID为select的标签中的文本颜色

 

4.后代选择器：

后代选择器（descendant selector）又称为包含选择器。

后代选择器可以选择作为某元素后代的元素。

写法：div p

示例：选择 div标签里面的所有子元素 为p标签