css样式表的写法理解

<style>

  #a1{

    background-color:red;

  }

  #a1 div{

    background-color:green;

  }

  #a1 div div{

    background-color:gray;

  }

  .a2{

    background-color:yellow;

  }

  .a3{

    background-color:blue;  

  }

  .a4{

    color:red;

  }

  #a5,.bb{

     background-color:skyblue;

  }

</style>

<!-- #a1 div{}的含义:表示设置id=a1的div,其下的一级div的样式，可以延伸到所有下级  -->

<!-- #a1 div div{}的含义:表示设置id=a1的div，其下第二级div的样式  -->

<div id="a1">

  <div>aa(显示绿色)</div>

  <div>bb(显示绿色)</div>

  <div>

      dd

      <div>

         cc(显示灰色)

      </div>

  </div>

  asdflajsdflj(显示红色)

</div>

<div class="a2">dd(显示黄色)</div>

<!--一个div使用两种分开指定样式-->

<div class="a3 a4">

  ajljalf (背景蓝色，字体红色)

</div>

<!--样式表中不同样式名使用相同设置，用,分开-->

<div id="a5">jlkj</div>

<div class="bb">jlklklj</div>