Home  >  Article  >  Web Front-end  >  求教一个js、css结合table鼠标经过变色问题_html/css_WEB-ITnose

求教一个js、css结合table鼠标经过变色问题_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 12:02:571000browse

今天从网上找到些资料,js、css结合table鼠标经过变色,且表格隔行变色,但代码存在个问题,非常严重。就是添加这些代码后,页面所有的表格都受影响了,如何修改CSS代码,只对bb表格使用样式,其他表格不使用。高手帮帮忙,指导下如何修改代码啊?

<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style type="text/css">#bb th,td{text-align:left;padding:.5em;border:1px solid #fff;}#bb th{background-color:#328aa4;color:#fff;}td{background:#e5f1f4;}tr.even td{background:#e5f1f4;}tr.odd td{background:#f8fbfc;}tr.over td{background:#bce774;}tr.out td{}</style></head><script type="text/javascript">function changeTableBg(){	if(document.getElementById("bb")== null)	{		return false;	}	var changeTr=document.getElementById("bb").getElementsByTagName("tr");    for(i=0;i<changeTr.length;i++)    {		changeTr[i].className=(i%2>0)?"even":"odd";	    changeTr[i].temp=changeTr[i].className;	    changeTr[i].onmouseover=function()		{	             this.className='over';        	    }		changeTr[i].onmouseout=function()		{	             this.className=this.temp;        		}    }}</script><body onLoad="changeTableBg()">......


回复讨论(解决方案)

#bb td{background:#e5f1f4;}#bb tr.even td{background:#e5f1f4;}#bb tr.odd td{background:#f8fbfc;}#bb tr.over td{background:#bce774;}#bb tr.out td{}

谢谢你的指点

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn