用js,css,html怎么做双色斑马线表格?

html-css018

用js,css,html怎么做双色斑马线表格?,第1张

用jquery来做很简单 就几行代码

比如说是table布局

首先设定 样式1

.style1{样式自己定义}

.style2{...}

引用jquery内裤

写方法

$(function(){

$("tr:even").addClass("style1") //奇数行的样式

$("tr:odd").addClass("style2") //偶数行的样式

})

这样就是交替行的样式

用样式表能实现,就是将表格偶数行和奇数行的标签的"class"属性分别设置为不同的值,然后在样式表里控制就可以了。比如

读出数据后存在rs里。

<%

for(int k=0rs.next()k++){

%>

<tr class="<%=viewTest.getTrClass(k)%>">。。。。</tr>//表格行

<%

}

%>

viewTest类的代码

public viewTest{

public static String getTrClass(int k){

if(k%2==0){

return "tr_even"//偶数行的class

}

return "tr_odd"//奇数行的class

}

}

然后在样式表里控制

.tr_even{//样式表里怎么控制就随心所欲了。。

}

.tr_odd{

}

顺便说一下,样式表设置了表格行的背景色之后会被单元格(<td>标签)的背景色盖过去,所以在样式表里还要把单元格背景设为透明