TA貢獻44條經驗 獲得超84個贊
.wrap:hover表示的是當鼠標移動到wrap上面的時候wrap的樣式變化。
.wrap:hover .box表示的是當鼠標移動到wrap上面的時候box的樣式變化
TA貢獻107條經驗 獲得超146個贊
<!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>
TA貢獻3條經驗 獲得超2個贊
不加空格? 才奇怪呢? ；? 加了空格后 就很明白 ? 當wrap 當 hover 后，子元素 box 產生如下效果{ 。。。。}
PS；看你第一行代碼時一驚，這是神馬東西，嚇的我感覺百度了好幾下呢。。。
TA貢獻1條經驗 獲得超0個贊
hover前面有空格和沒有空格有不一樣的效果，:hover前面沒有空格，影響的只是該元素的兄弟節點；但是，如果前面有了一個空格，那效果就大大不一樣了,有個空格影響的就是 該元素下面的子節點了。
舉報