css选择器的优先级：

    通配选择器  0

    标签名选择器  1

    类选择器  10

    id选择器  100

    后代选择器  选择器1 选择器2 ...(会有相加的过程)

    群组选择器  选择器1，选择器2，...(不会有相加的过程)

            1.相同类型的选择器，样式冲突下，后覆盖前

            2.不同类型的选择器，样式冲突下，优先级高覆盖优先级低

            3.*< Tags < class < id < style < !important

            4.！important慎用（必须用时，需要加注释说明一下）

1.同类型，后覆盖前

 body{

    width: 200px;

    height: 300px;

    background: red;

}

body{

    background: blue;

}

颜色为蓝色

2.不同类型，优先级高的会覆盖优先级低的

div{

    height: 200PX;

    background: red;

}

.cla{

    background: pink;

}

颜色为粉红色

3.群组选择器，不会有相加的过程

span{

     display: block;

    width:200px;

    height: 200px;

    background: red;

}

div{

    width:200px;

    height: 200px;

    background: blue;

}

span,div{

    width: 200px;

    height:200px;

    background: pink;

}

颜色为粉红色

4.后代选择器，会有相加的过程

div span a{

    background: red;

}

div span{

    background: green;

}

颜色为绿色