代碼片段：

1，css代碼

復制代碼 代碼示例:

table {border-collapse:collapse;border:solid #999;border-width:1px 0 0 1px;}

table td {border:solid #999;border-width:0 1px 1px 0;}

tr.t1 td {background-color:#fff;}/* 第一行的背景色 */

tr.t2 td {background-color:#eee;}/* 第二行的背景色 */

tr.t3 td {background-color:#ccc;}/* 鼠標經過時的背景色 */

tr.t4 td {background-color:#E2EBED;}

2，html內容部分

復制代碼 代碼示例:

11	11	11
11	11	11
11	11	11
11	11	11
11	11	11
11	11	11
11	11	11
11	11	11
11	11	11
11	11	11
11	11	11
11	11	11
11	11	11
11	11	11

3，javascript代碼部分

復制代碼 代碼示例:

var Ptr=document.getElementById("tab").getElementsByTagName("tr");

function $() {

for (i=2;i

Ptr[i-1].className = (i%2>0)?"t1":"t2";

}

}

window.οnlοad=$;

for(var i=1;i

Ptr[i].οnmοuseοver=function(){

thisthis.tmpClass=this.className;

this.className = "t3";

};

Ptr[i].οnmοuseοut=function(){

thisthis.className=this.tmpClass;

};

}

總結

以上是生活随笔為你收集整理的html中隔行的代码,js+css 控制表格隔行变色与单行高亮的代码的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。