一些常用的选择器

标签选择器:

使用原有的自身的标签进行样式的设置;每设置一个标签,所有的该标签都存在设置的标签。

例:p{color:red;}

类选择器:

需要对想要设置的一个或多个标签设置相同的class类名,同时一个标签可以设置多个class类名,中间使用空格隔开 。

例:<p class="pink blue"></p>

.pink{color:red;}

.blue{color:blue;}

ID选择器:

需要对标签进行ID的定义,ID在一个网页中是唯一存在的,使用的时候是通过ID来查找该标签来进行样式的设置的。

例:<p id="myhcar"></p>

#myhcar{color:red;}

组合选择器:

就是样式设置相同的多个标签,可以组合在一起进行设置,之间使用“,”隔开。

例:<p id="myhcar"></p>

<a href="#"></a>

p,a{color:red;}

后代选择器:

就是对嵌套的标签进行内层标签的样式的设置时,不必再设置其他信息就能查找到。中间使用“ ”空格隔开。

例:<div>

<p id="myhcar"></p>

</div>

div p{color:red;}

 子代选择器:

就是对嵌套标签进行内层标签的样式设置时,仅仅设置子代标签的相关标签的样式设置,而不对孙代的标签进行设置。

例:.mychar>div{

    width:100px;

    height:100px;

}

<div class="mychar">

  <div>

    <div>

    </div>

  </div>

</div>

posted @ 2016-07-31 16:30  潜龙出海  阅读(229)  评论(0编辑  收藏  举报