首先第一条很重要
元素添加hover伪类选择器时候一定要紧贴这hover，不能有空格，有空格的话表示给该元素的所有子元素设置里hover样式。
错误例子：
ul :hover{} //ul的所有子元素设置了hover样式
正确例子：
ul:hover{} // ul会显示出想要的效果
第二
当想要在父元素添加hover在指定的子元素的实现效果
子元素应该写在hover后面空格隔开
<style>
li{
width: 100px;
height: 100px;
border:1px solid #000;
transition:transfrom 2s linear;
}
ul:hover .one{ // 子元素写在hover后面空格隔开
transform:rotateY(90deg);
}
ul:hover .two{
transform:rotateY(0deg);
}
ul:hover .thr{
transform:rotateY(360deg);
}
</style>
<body>
<div style="width: 300px;height : 300px; background-color:#ccc"></div>
<ul>
<li class="one">di1ge</li>
<li class="two">di2ge</li>
<li class="thr">di3ge</li>
</ul>
</body>
这个例子中就是当鼠标经过ul的时候，li会在设置的角度旋转
注意
仅可以给自身的子元素设置样式，给其他元素子元素设置无效
接着上个例子举例子：
div:hover .one{} //不显示任何效果，hover失效
更多技术博客请看：我的个人博客地址 www.blogwxb.cn