css如何让鼠标指到的单元格变色

css如何让鼠标指到的单元格变色

<table><tr><td>1</td><td>2</td></tr></table>td:hover{ background:red;}鼠标悬停的单元格变为红色
2014-11-04

利用链接<a>及a：hover改变单元格的css样式。
:hover 选择器用于选择鼠标指针浮动在上面的元素。
提示：:hover 选择器可用于所有元素，不只是链接。
提示：:link 选择器设置指向未被访问页面的链接的样式，:visited 选择器用于设置指向已被访问的页面的链接，:active 选择器用于活动链接。
注释：在 CSS 定义中，:hover 必须位于 :link 和 :visited 之后（如果存在的话），这样样式才能生效。
<style type="text/css"><!--a:link {color: #11ef06;text-decoration: none;}a:hover {font-size: 14px;font-weight: bold;color: #CC3300;text-decoration: none;}2015-11-06

<script>function overIt(){ var the_obj = event.srcElement; if(the_obj.tagName.toLowerCase() == "td"){ the_obj=the_obj.parentElement; the_obj.oBgc=the_obj.currentStyle.backgroundColor; the_obj.oFc=the_obj.currentStyle.color; the_obj.style.backgroundColor='red'; the_obj.style.color='blue'; the_obj.style.textDecoration='underline'; }}function outIt(){ var the_obj = event.srcElement; if(the_obj.tagName.toLowerCase() == "td"){ the_obj=the_obj.parentElement; the_obj.style.backgroundColor=the_obj.oBgc; the_obj.style.color=the_obj.oFc; the_obj.style.textDecoration=''; }}</script><table border=1 width=400 onmouseover="overIt()" onmouseout="outIt()"><tr bgColor=#111111> <td>aaa</td><td>aaa</td><td>aaa</td><td>aaa</td></tr><tr bgColor=#222222> <td>aaa</td><td>aaa</td><td>aaa</td><td>aaa</td></tr><tr bgColor=#333333> <td>aaa</td><td>aaa</td><td>aaa</td><td>aaa</td></tr><tr bgColor=#444444> <td>aaa</td><td>aaa</td><td>aaa</td><td>aaa</td></tr><tr bgColor=#555555> <td>aaa</td><td>aaa</td><td>aaa</td><td>aaa</td></tr><tr bgColor=#666666> <td>aaa</td><td>aaa</td><td>aaa</td><td>aaa</td></tr><tr bgColor=#777777> <td>aaa</td><td>aaa</td><td>aaa</td><td>aaa</td></tr><tr bgColor=#888888> <td>aaa</td><td>aaa</td><td>aaa</td><td>aaa</td></tr><tr bgColor=#999999> <td>aaa</td><td>aaa</td><td>aaa</td><td>aaa</td></tr><tr bgColor=#aaaaaa> <td>aaa</td><td>aaa</td><td>aaa</td><td>aaa</td></tr><tr bgColor=#bbbbbb> <td>aaa</td><td>aaa</td><td>aaa</td><td>aaa</td></tr><tr bgColor=#cccccc> <td>aaa</td><td>aaa</td><td>aaa</td><td>aaa</td></tr><tr bgColor=#dddddd> <td>aaa</td><td>aaa</td><td>aaa</td><td>aaa</td></tr><tr bgColor=#eeeeee> <td>aaa</td><td>aaa</td><td>aaa</td><td>aaa</td></tr><tr bgColor=#ffffff> <td>aaa</td><td>aaa</td><td>aaa</td><td>aaa</td></tr></table>这段代码可以帮助实现鼠标滑过单元格变色！
2014-11-04