css的hover用法

元素添加hover伪类选择器时候一定要 紧贴 这hover， 不能有空格 ，有空格的话表示给该元素的所有子元素设置里hover样式。

错误例子：

ul :hover{} //ul的所有子元素设置了hover样式

正确例子：

ul:hover{} //ul会显示出想要的效果

ul:hover .one{// 子元素写在hover后面空格隔开

              transform:rotateY(90deg)

          }

 ul:hover .two{

              transform:rotateY(0deg)

          }

ul:hover .thr{

              transform:rotateY(360deg)

          }

仅可以给自身的子元素设置样式 ，给其他元素子元素设置无效

接着上个例子举例子：

div:hover .one{}//不显示任何效果，hover失效

给兄弟元素设置：

ul:hover+.one

1.直接在你的那些div的里面的a上没一个都自己加个onmouseover,onmouseout实现:hover的效果，注意只能模仿实现，并不是什么都可以style=""实现

就像你这里的div a:hover这个选择器

还有我不知道你为什么一定要这样做，灵活下啦。

2.试试js

比如jquery的$("div a:hover")应该能搞定吧。

用css伪类hover可以实现这个功能。

1、新建html文档，在body标签中添加一个div标签，然后在div标签中添加p标签，为p标签添加内容：

2、为了方便演示，给div标签设置宽高和背景颜色，然后给p标签设置“display”属性，属性值为“none”，这样p标签中的文字默认情况下不会显示：

3、给div设置hover伪类，当鼠标移动到div区域时，设置p标签的样式为块级元素“block”：

4、这样当鼠标移动到div上时就会显示p标签内容，鼠标离开就不显示p标签内容：

---