CSS中三种selector简介

一、HTML selector 

HTML selector就是HTML的tags，比如P，DIV，TD等。如你用CSS定义了它们，在整页中，这个Tag的性质就按照你的定义来显示了。HTML selector的语法如下： 
tag {property:value}比如我们想叫H1的颜色是红的H1 {color: red}这里还要告诉你CSS的一个特点，它可定义好几个selector在一个rule里。比如H1，H2 TD {color: red}这个定义就能让所有的H1，H2和TD的颜色都为红色。
 
二、Class selector 

Class selector有两种，一种叫相关class selector，它跟一个HTML的tag有关系。它的语法是tag.Classname {property:value}比如我们想叫一些而不是全部 H1 的颜色是红的 H1.redone {color: red}这样在下面的语句中，第一个H1是红色的，而第二个就不是了＜H1 class="redone"＞红色的题目＜/H1＞＜H1＞普通的题目＜/H1＞第二种是独立class selector。它可被任何HTML tag所应用。它的语法如下.Classname {property:value}假如我们有下面这个定义.blueone {color: blue}那么我们可以把他应用到不同的Tag当中去。比如＜H1 class="blueone"＞蓝色的题目＜/H1＞＜P class="blueone"＞蓝色的段落＜/P＞显然 class selector 给了我们更多的自由. 
 
三、ID selector 

ID selector其实跟独立class selector的功能一样。而区别在于它们的语法和用法不同，以及对于Javascript操纵HTML元素有帮助。它的语法如下#IDname {property:value}假如我们有下面的定义#yelowone {color: yellow}我们可以运用这个定义到任何的有同样ID名字的tag，比如＜SPAN ID="yellowone">text here＜/SPAN＞你可能觉得既然ID selector和独立class selector功能一样，为什么两者都存在呢。如果你知道用CSS-P来定位的话, 你就明白它们的区别了。有ID的 HTML 元素可以被CSS-P和JavaScript来操纵。到现在为止，你已经大概知道如何来写CSS的定义了，下面五节我们将会告诉你如何用CSS来操纵或修改。