以下样式不会起作用。.son0和.son1有各自的字体颜色，鼠标经过父元素.father时，只会改变.father的字体颜色，其子元素的字体颜色不受影响。因为:hover的样式只是追加给.father本身的，而不是.father下面的所有元素。解决办法见下文。
.father {
color: purple;
.father:hover {
color: blue;
.son0 {
color: red;
.son1 {
color: green;
<div class="father">
father
<div class="son0">son0</div>
<div class="son1">son1</div>
</div>
我们可以在hover时，通过 通配符 * 改变所有元素的颜色，如下。
.father:hover意思是：加了:hover的元素本身。
.father:hover *意思是：加了:hover的元素下面所有子孙元素，此时父元素的颜色不会改变。因此需要将再给.father本身改一下颜色。
.father {
color: purple;
.father:hover * {
color: blue;
.father:hover {
color: blue;
.son0 {
color: red;
.son1 {
color: green;
