hover用法:
必须-移入父级操作子级
也可以移入自己操作自己
1.对自身作用
ul li:hover { background: red; }
2.对自身的子集作用
ul li:hover a { background: red; }
3.对兄弟元素的作用
ul li:hover +li { background: red; }
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> ul,li{margin:0 ; padding: 0;} ul{ 600px;height: 400px;border: 1px solid red; } li{list-style: none;float: left;font-size: 32px;margin-right: 25px;} ul li:hover +li { background: red; } /* ul:hover li { background: red; } */ </style> </head> <body> <div> <ul> <li><a href="">首页</a></li> <li><a href="">首页</a></li> <li><a href="">首页</a></li> <li><a href="">首页</a></li> <li><a href="">首页</a></li> <li><a href="">首页</a></li> </ul> </div> </body> </html>