css基础选择器说明

  • css选择器分为基础选择器与复合选择器。复核选择器由基础选择器通过不同方式组合成。
  • 选择器主要是为了对页面标签进行一对一、一对多、多对一的样式控制。
  • 书写格式为:选择器{属性:值;}

基础选择器:

  • 标签选择器

       格式:标签{属性:值;}。  作用范围为调用该css样式表的页面中某种类型所有的标签。

      css基础选择器说明

        效果:

       css基础选择器说明

        我们可以看出,只有p标签中的文字格式发生了变化,而span标签中的格式不变。

  • 类选择器

        格式:.类名{属性:值;}。  作用范围为调用该css样式表的页面中调用的该类选择器的标签。一个标签可以使用多个类选择器,一个类选择器可以作用于多个标签。

    css基础选择器说明

    效果:

    css基础选择器说明

    我们可以看出,span标签调用了con类选择器,样式发生了变化,而p标签没有调用,没有发生变化。

  • ID选择器

        格式:#id{属性:值;}。  作用范围为调用该css样式表的页面中使用该的标签。一个id选择器在一个页面只能使用一次,如果使用两次或两次以上,则不符合W3C规范。

    css基础选择器说明

    效果:

    css基础选择器说明

我们可以看到,id为box的div盒子样式发生了变化,而其他盒子没有变化。

  • 通配符选择器
    格式:*{属性:值;}。  作用范围为调用该css样式表的所有的标签,给所有的标签使用相同的样式。不推荐使用,会增加浏览器负担。