页面鼠标滑过某行时背景变色（简单一例）

最新推荐文章于 2024-04-08 19:26:06 发布

原创最新推荐文章于 2024-04-08 19:26:06 发布 · 1.9k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#function #table #class #html #border #list

分布式和技术框架们专栏收录该内容

24 篇文章

订阅专栏

本文介绍了一种使用HTML和JavaScript实现表格行鼠标悬停时背景颜色变化的方法。通过为表格行添加特定的onmouseover和onmouseout事件处理程序，可以在用户交互时改变表格行的背景颜色。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Insert title here</title> <mce:style language="text/css"></mce:style><style language="text/css" mce_bogus="1">#table tr.color1{ background-color:#ff0; }</style> <mce:script type="text/javascript"></mce:script> </head> <body id="" class=""> <table width="100%" border="0" cellspacing="1" cellpadding="4" class="list" name="table" id="table"> <thead> <tr> <th>Title</th> <th>Title</th> <th>Title</th> <th>Title</th> </tr> </thead> <tbody> <tr> <td><a href="">example</a></td> <td>example</td> <td>2008-05-09 17:21:04</td> <td>example</td> </tr> <tr> <td><a href="">example</a></td> <td>example</td> <td>2008-05-09 17:21:04</td> <td>example</td> </tr> </tbody> </table> </body> </html>