CSS选择器举例使用讲解

　　CSS选择器最基本的有四种：标签选择器、ID选择器、类选择器、通用选择器。CSS是以后学习DIV+CSS架构WEB标准的基础，也是CSS的精典内容。以下是青锋建站带给大家的CSS选择器的使用举例

CSS标签选择器

一个完整的HTML页面是有很多不同的标签组成，而css标签选择器，则是决定哪些标签采用相应的CSS样式，比如，在style.css文件中对p标签样式的声明如下：
　　这么做，会使页面中所有p标签的背景都是#ddd，文字大小均是:0.8em，颜色为#636363，这在后期维护中，如果想改变整个网站中p标签背景的颜色，只需要修改background属性就可以了，就这么容易!当然你也可以设置整个页面中所有的div的属性、a链接的属性、span的属性，这么做方便是方便，但是不够灵活，如果页面中除了某个p标签背景不是红色外，其他的都是红色，就不能用这种方法定义了。

CSS ID选择器

ID选择器在某一个HTML页面中只能使用一次，就像只有一个身份证 (ID)一样，不重复！在页面中使用ID选择器更具有针对性，如：

先给某个HTML页面中的某个p标签起个ID，代码如下：
<p id="one">www.sjzphp.com:石家庄专业的网站建设专家</p>
在CSS中定义ID为one的p标签的属性，就需要用到“#”，代码如下：

CSS类选择器

　　这种css选择器更容易理解了，就是使页面中的某些标签(可以是不同的标签)具有相同的样式。大家可以和PHP语言中的类联系起来，类表达具有相同特点的一部分人或物，当我们把几个P标签设置为相同的类名，然后再应用CSS样式，这一类P标签就具有这个样式，而且应用类属性的元素可以是不同元素。和ID选择器的用法类似，只不过把id换做class，如下：
如果我还想让div标签也有相同的样式，怎么办呢？加上同样的class就可以了，如下：
　　这样我们可以将多个样式用到同一个标签中，当然也可以，ID和class一块用<div id="my" class="one yellow left">ID和class可同时应用到同一个标签</div>

CSS选择器的集体声明

　　在我们使用选择器的时候，有些标签样式是一样的，或者某些标签都有共同的样式属性，我们可以将这些标签集体声明，不同的标签用“,”分开，比如：
　　2.再举个例子，无论什么样的选择器，“标签选择器”，“ID选择器”，“类选择器”，只要是选择器，只要有公共的CSS代码，就可以用“选择器的集体声明”，起到精简代码的作用，有一段代码如下：
　　我们就可以将上面的代码进行精简，把公共的CSS代码用选择器的集体声明提取出来，有点类似小学的“提取公因式”似的，如下：
  　　这是选择器的集体声明的经典应用，把共同的部分提取出来，这么做的好处，相同的部分共同定义，不同的部分单独定义，保证风格统一，样式修改灵活，这也是优化CSS代码的一块，要记住！

CSS选择器的嵌套

选择器也是可以嵌套的，如：
　　这样的好处就是不需要在单独的为ID为div1的标签内的p标签内的a标签单独定义class选择器或者ID选择器，CSS代码不就少了嘛~同样也是CSS代码优化的一块。
　　以上就是青锋建站带给大家的CSS选择器的使用举例，青锋建站，提供专业的高品质网站制作服务，包括网站建设，SEO，网络营销，PHP开发，网站建设知名品牌，全国接单，专业做优化型网站，为企业构建营销平台。

转载请注明来源网址：青锋建站-http://www.sjzphp.com/webdis/cselector.html