本文共 1067 字，大约阅读时间需要 3 分钟。

1、标签（类型）选择符：就是针对html文档中的标签（哪些html标签应用哪些css样式）

              标签{属性：值}

           例如：p{font-size:12px;}

                    div{background:blue;}

2、类选择符：可以自己定义样式，应用于一个或多个网页元素，类在网页中可以出现多次，用于定义重复的样式。

                                  类以英文点“.”开头，后面的名字自己定义，类定义后还需要在网页中加入class=”类名称“，加以调用。

       在样式中

              .类名称{属性：值}

      在body中

      <标签 class=“类名称”>......</标签>

               例如：

               .warning{

属性：值}

        <p class="warning">......</p>

        同时给某个元素应用多个类，类之间用空格隔开

         <标签 class=“类名称1   类名称2”>......</标签>

        例如：

        <p class="a1 a2">......</p>

3、id 选择符：与类相似，只是以英文“#”开头，因为id具有唯一性，所以在网页中只能出现一次，用于定义只出现一次的样式。

     

      在样式中

              #id名称{属性：值}

      在body中

      <标签 id=“id名称”>......</标签>

               例如：

               #warning{属性：值}

        <p id="warning">......</p>

        同时给某个元素应用多个类与id，

         <标签 class=“类名称1   类名称2” id=“id名称”>......</标签>

        例如：

        <p class="a1 a2" id="a6">......</p>

4、通配选择符：用于定义所有html元素

      *{ 属性：值}

     5、包含选择符：配套或派生，选择符的嵌套使用

     大标签 小标签{属性：值}

          例如：table td{属性：属性值}     #header li a{属性：属性值}

  优点：就是不需要再单独为id为header的标签内，li标签内的a标签单独定义class或id，css代码就少了，同样也优化了css代码

     6、选择符分组(集体控制)：将同样的样式定义用于多个选择符，选择符之间用逗号分隔

  选择符1，选择符2，选择符3......{属性：属性值}

          例如：p,div,.class{属性：属性值}

     7、标签指定式选择符：如果既想使用id或class，也想同时使用标签选择符

          例如：h1#content{}表示针对所有id为content的h1标签

                   h1.p1{}表示针对所有class为p1的h1标签

     8、组合选择符：将以上选择符进行组合使用

          例如：h1.p1，#content h1{}

转载地址：http://nwjob.baihongyu.com/