<style type="text/css">
.TFtable{
width:100%;
border-collapse:collapse;
}
.TFtable td{
padding:7px; border:#4e95f4 1px solid;
}
/* provide some minimal visual accomodation for IE8 and below */
.TFtable tr{
background: #b8d1f3;
}
/* Define the background color for all the ODD background rows */
.TFtable tr:nth-child(odd){
background: #b8d1f3;
}
/* Define the background color for all the EVEN background rows */
.TFtable tr:nth-child(even){
background: #dae5f4;
}
</style>
<table class="TFtable">
<tr><td>Text</td><td>Text</td><td>Text</td></tr>
<tr><td>Text</td><td>Text</td><td>Text</td></tr>
<tr><td>Text</td><td>Text</td><td>Text</td></tr>
<tr><td>Text</td><td>Text</td><td>Text</td></tr>
</table>
3条答案
按热度按时间r1zhe5dt1#
或者,使用jQuery(JavaScript)和这些CSS参数来达到所需的结果:
添加两个新的CSS类:
最后是一些jQuery脚本:
执行函数:updateList(),每次隐藏/显示此表中的一行时。
fumotvh32#
你可以通过CSS来实现。
2w2cym1i3#
使用纯css,
假设筛选的行添加了“.dn”类。