CSS入门（二）CSS选择器

前言

       至于为什么要讲这个！后面学习JQuery的时候是肯定需要的！我还不如在这里先给大家打个基础！

方法

1.基本选择器

我们知道，当我们为HTML标签添加样式的时候，首先想到的是我要往哪个地方加啊！如果有多个相同的标签我该怎么办啊！这些都要靠JS选择器来进行实现！

1）标签选择器
    标签名{样式名1：样式值1;……}
    作用：会将当前网页内的所有该标签增加相同的样式

/*声明一个段落p样式，所有p标签均适用*/
p {
	color: red;
}

2）id选择器:
    #标签的id属性值{样式名1：样式值1;……}
    作用：给某个指定的标签添加指定的样式

例如：HTML标签中有一个id为test的p标签

<p id="test">我的段落</p>

则使用id选择器添加该标签样式为：（特别的：html中的id唯一表示一个标签，原则上不可以指定多个；若多个则均添加该样式）

#test {
	color: red;
}

3）类选择器：
    .类选择器名{样式名1：样式值1;……}
    作用：给不同的标签添加相同的样式

例如：HTML标签有一个class属性为test的p标签和b标签

<p class="test">我的段落</p>
<b class="test">加粗</b>

则使用类选择器添加样式为：

.test {
	color: red;
}

以上三种为最基本的选择器：

标签选择器一般用于一类标签的样式；id选择器一般用于一个标签的样式；类选择器用于一类标签的样式（即使它们的标签是不同的）

2.其他选择器

1）同时定义多个选择器样式，使用逗号分隔

例如：定义P标签、类属性为test的标签样式

.test,p {
	color: red;
}

2）定义子标签样式

语法：父标签  子标签 {样式内容}

例如：div标签下的p标签添加样式

<div><p>我的段落</p></div>

div p {
	color: red;
}

3）属性选择器

我们知道，有些时候我们需要标签元素的属性来定义该元素，如name属性

语法：标签名[属性名=属性值]

例如：name属性为test的div标签添加样式

<div name="test">我的段落</div>

div[name="test"] {
	color: red;
}

另外，还有其他特殊的选择器没有说明，我这里只是列举其中一些常用的选择器，初期使用足够了！

其他特殊的选择器我们讲解JQuery的时候在详细说明！

写后感：

其实，说白了CSS选择器的核心就是定位HTML中的元素位置，这一点尤为重要，尤其是在JQuery中将更加明显！