1、父子选择器/派生选择器
<div calss="wrapper">
<span calss="box">123</span>
</div>
<span>456</span>
1)方式一
div span{
background-color:red;
}
2）方式二
.wrapper span{
background-color:red;
}
3)方式三
.wrapper .box{
background-color:red;
}
2、直接子元素选择器
<div>
<em>1</em>
<strong>
<em>2</em>
</stong>
</div>
div > em{
background-color:red;
}
3、选择器内核选择方式
从左到右，从右往左？
从右往左
4、并列选择器（重点）
标签、class、id、直接子元素等随便组合
组合后的选择器优先级，按照组合元素相加，权重越高，越优先；
如果权重一样，则后面代码覆盖前面代码，后来先到；
!important跟在选择器后面，则此选择器为权重最高等级;
如果选择器后面都有!important，则根据前面组合元素的权重来决定优先级。
div.demo{
}
#id div p.class{
}
div .classP#idP{
}
5、分组选择器
列子：让下面标签内的元素的背景色都为红色
<body>
<em>1</em>
<strong>2</strong>
<span>3</span>
</body>
方法一
em{
background-color:red;
}
strong{
background-color:red;
}
span{
background-color:red;
}
方法二
em,
strong,
span{
background-color:red;
}
posted on
