一直搞不懂hover 为什么有时候放在前面 ，有时候放在后面
有时候又要加空格 不加空格就没效果，我一直都是这样用的例如a:hover{}
这又是什么意思 还非要加个空格 ， 要不然没效果
这是一个鼠标划过box1反转背面box2的效果，谁能告诉我呀 ，谢谢
慕斯卡5910870浏览 4584回答 11
11回答
-
ChinaCJM
.wrap:hover表示的是当鼠标移动到wrap上面的时候wrap的样式变化。.wrap:hover .box表示的是当鼠标移动到wrap上面的时候box的样式变化 -
weibo_哆啦A梦有大口袋_0
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> .wrap{width: 100px;margin: 0 auto;} .box1{width: 100%;height: 100px;background: #ccc;} .box2{width: 100%;height: 100px;background: #666;} /*当移入父元素wrap的时候,它下面的子元素box1,box2背景颜色改变,这里的空格表示后面的元素为子元素*/ .wrap:hover .box1{background: #666;} .wrap:hover .box2{background: #ccc;} </style> </head> <body> <div class="wrap"> <div class="box1"></div> <div class="box2"></div> </div> </body> </html> -
ybc4652
后面不加.box1的话是他本身的hover效果 加上的话是.box1的样式改变 -
leon66
不加空格 才奇怪呢 ； 加了空格后 就很明白 当wrap 当 hover 后，子元素 box 产生如下效果{ 。。。。}PS；看你第一行代码时一惊，这是神马东西，吓的我感觉百度了好几下呢。。。 -
qq_Material_0
hover前面有空格和没有空格有不一样的效果，:hover前面没有空格，影响的只是该元素的兄弟节点；但是，如果前面有了一个空格，那效果就大大不一样了,有个空格影响的就是 该元素下面的子节点了。 -
echo_kinchao
那是要根据你要控制的范围来确定的 -
老猿
这个空格代表box是wrap里面的子元素 -
没看完
我觉得这样写你会更好理解一点吧 .wrap .box1:hover 不知道你的html是怎么写的 -
Walk_
这个空格是表示，后面是前面的子节点。PS；看你第一行代码时一惊，这是神马东西，吓的我赶紧百度了一下。。。
随时随地看视频慕课网APP
CSS3
Html/CSS
Html5