table鼠标滑过行变色
1、1.新建html页面。如图：
2、创建table。如图：
3、为了让效果很明显，先对table设置基本样式。如图：
4、在浏览器中打开新建的html页面。效果如图：
5、添加 table tr:hover{background-color: #dafdf3;} 设置鼠标滑过行背景变色，重新刷新浏览器页面。如图：
6、所有代码：
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>table鼠标滑过行变色</title> <style type="text/css"> table{margin: 10px auto; width: 500px; border-collapse: collapse; } table tr td {border:1px solid #e7e7e7; height: 25px;} .title{text-align: center; font-weight: bolder;} table tr:hover{background-color: #dafdf3;} </style></head><body> <div>table鼠标滑过行变色</div> <table cellpadding="0" cellspacing="0"> <tr> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> </tr> </table></body></html>