标签：日常 visit bsp logo container highlight 文档 基本用法 不同的
标签选择器（如：body,div,p,ul,li）
.类选择器（如：class="head",class="head_logo"）
ID选择器（如：id="name",id="name_txt"）
全局选择器（如：*号）
.组合选择器（如：.head .head_logo,注意两选择器用空格键分开）
.继承选择器（如：div p,注意两选择器用空格键分开）
伪类选择器（如：就是链接样式,a元素的伪类，4种不同的状态：link、visited、active、hover。）
字符串匹配的属性选择符(^ $ *三种，分别对应开始、结尾、包含)
以上选择器在日常开发中最常用的就是标签选择器、类选择器和id选择器，下面是这三种选择器的基本用法
1、标签名选择器 一个XHTML文档中有许多标签，例如p标签，h1 标签等。若要使文档中的所有p标签都使用同一个CSS样式，就应使用标签选择器。
|
1
2
|
div {color:red;border:1px blue solid;} p {color:#000;} |
2、类选择器 使用标签选择器可以为整个XHTML文档中的同一个标签指定相同的CSS样式。但是在实际运用中，XHTML文档中的同一个标签会被反复使用。若要为相同的标 签赋予不同的CSS样式就应使用类选择器。
|
1
2
|
<div class="test">测试代码</div> .test {color:red;border:1px blue solid;} |
3、id选择器，id选择器是唯一的，只可以获取独一无二的一个元素。
3、id选择器，id选择器是唯一的，只可以获取独一无二的一个元素。
|
1
2
|
<div id="test">测试代码</div> #test {color:red;border:1px blue solid;} |
注意：
1.选择器的特殊性--权限规则
标签权限：1
类选择器权限：10
ID选择器权限：100
继承权限：最低
如： <p class="first">我是一个好孩子</p>
p{color:red;}、 .first{color:green;} p和first都匹配在p标签上，但是最后会显示绿色
2.层叠
在html文件中对于同一个元素可以有多个css样式存在，当有相同权重的样式存在时，会根据这些css样式的前后顺序来决定，处于最后面的css样式会被应用
p{color:red;}
p{color:green;}
<p class="first">三年级时，我还是一个<span>胆小如鼠</span>的小女孩。</p>
最后 p 中的文本会设置为green，这个层叠很好理解，理解为后面的样式会覆盖前面的样式。
标签：日常 visit bsp logo container highlight 文档 基本用法 不同的
原文地址：http://www.cnblogs.com/lucky-n/p/7400402.html
