??? 今天主要学习了CSS中的选择器，CSS选择器（selector)是css的核心，通过利用selector可以为html文档添加各种样式，并且能够更好的维护html页面的样式，为提高整个网站的前端页面样式的维护性起了决定性的作用。

???? 今天的主要学习内容如下：

????? 1.元素选择器（element selector）

???????? 最常见的元素选择器是html元素?? eg:h1{color:black;}

??????2.类选择器（class selector）

???????? 要应用样式而不考虑具体涉及的元素，这时最常用使用的是类选择器。

???????? eg: html:<p class="warning">when handling plutonium,care must be taken to avoid the </p>

?????????????????????? <p>With plutoninum,<span class="warning">the possibility of implosion????????????? is</span>aaa</p>

??????????????? css: .warning{font-weight:bold;}

????????? 这时，所有class属性为warning值的元素都会应用bold样式

????????? 2.1? 多类选择器

??????????????? 一个class值包含一个词列表?，各个词之间用空格分离。

?????????????? eg:html:<p class="urgent warning">when handling plutionium,care must be taken</p>

??????????????????? css: .warning{font-weight:bold;}

?????????????????????????? .urgent{font-style:italic;}

?????????????????????????? .warning.urgent {background:silver;}

?????????????????这时这三个样式都会应用到此段文字。

?????????3.id选择器

?????????????? id选择器与类选择器类似，不同的是id选择器前面有一个#,如#first,更重要的是同一个id值只能在页面中使用一次。

?????????4.后代选择器

?????????????? h1? em{color:gray;}

?????????????? 这个样式将应用到以h1为祖先的所有em元素。

???????? 5.伪类和伪元素选择器

????????????? 5.1伪类选择器

?????????????????? :link? 指示作为超链接（即有一个href属性）并指向一个未访问地址的所有锚。

??????????????????????? a:link{color:blue;}--所有为访问过的超链接将显示为蓝色

?????????????????? :visited 指示作为已访问地址超链接的所有锚

??????????????????????? a:visited{color:red;}--所有访问过的超链接将显示为红色

??????????????????

?????????????????? :focus 指示当拥有输入焦点的元素

?????????????????? :hover 指示鼠标停留在哪个元素

?????????????????? :active 指示被用户输入激活的元素

?????????????????? 很多web页面对a都有下面的样式?：

????????????????????????????? a:link {color:navy;}

????????????????????????????? a:visited{color:gray;}

????????????????????????????? a:hover{color:red;}

????????????????????????????? a:active{color:yellow;}

???????????????? :first-child 用于选择元素的第一个子元素

?????????????????? eg:html <div><p><em>test</em></p></div>

??????????????????????? css? p:first-child{font-weight:bold;}

???????????????????将选择作为第一个子元素的段落

??????????????5.2伪元素选择器

????????????????????伪元素选择器还有:first-line???? :first-letter????? :before???? :after.

??????????????????

?

???????????

?

????????