<style type="text/css">
table
{
margin: 0 auto;
width: 600px;
}
table
{
border: 1px solid #000;
}
table tr th
{
height: 28px;
line-height: 28px;
background: #999;
}
table.stripe tr td
{
height: 28px;
line-height: 28px;
text-align: center;
background: #FFF;
vertical-align: middle;
}
/* 默认背景被白色 */
table.stripe tr.alt td
{
background: #F2F2F2;
}
/* 默认隔行背景颜色 */
table.stripe tr.over td
{
background: #EEECEB;
}
/* 鼠标经过时候背景颜色 */

</style>
<script type="text/javascript">
$(document).ready(function () {

$(".stripe tr").mouseover(function () {
$(this).addClass("over");
}).mouseout(function () {
$(this).removeClass("over");
})
$(".stripe tr:even").addClass("alt");

});

</script>

<table id="table" class="stripe">
<tr>
<td>
活动主题
</td>
<td>
获得
</td>
</tr>
<tr>
<td>
活动主题
</td>
<td>
</td>
</tr>
<tr>
<td>
活动主题
</td>
<td>
</td>
</tr>
</table>

隔行换色table的更多相关文章

  1. table隔行换色

    以前做表格隔行换色,是在tr上添加不同的背景色,但在程序开发的过程需要做判断,不够方便,而且生成的代码也比较多,现在的需求逐渐修改为JQ去控制简洁的表格去显示隔行换色 <script type= ...

  2. table 表格隔行换色实现

    table 表格隔行换色实现 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...

  3. jQuery实现table隔行换色和鼠标经过变色

    一.隔行换色 $("tr:odd").css("background-color","#eeeeee"); $("tr:even& ...

  4. php29号小结(隔行换色······)

    1.给表单加样式,可以用css.php与js.js这三种,其中最好用php与js,现在很推广用这种. css3样式隔行换色(table中) tr:nth-child(even){ background ...

  5. JQuery 表格 隔行换色 和鼠标滑过的样式

    $(document).ready(function () { $(".Pub_TB tbody tr:even td").css("background-color&q ...

  6. JQuery案例一:实现表格隔行换色

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  7. Bootstrap3基础 table-striped 表格实现隔行换色(浅灰色与白色交替)

      内容 参数   OS   Windows 10 x64   browser   Firefox 65.0.2   framework     Bootstrap 3.3.7   editor    ...

  8. jQuery应用实例2:表格隔行换色

    这里是用JS实现的:http://www.cnblogs.com/xuyiqing/p/8376312.html 接下来利用上一篇提到的选择器利用jQuery实现: 发现原来多行代码这里只需要两行: ...

  9. JS应用实例4:表格隔行换色

    HTML代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <t ...

随机推荐

  1. MFC学习之EDIT控件初始化

    //四种方法为EDIT控件初始化     //调用系统API     HWND hEidt = ::GetDlgItem(m_hWnd,IDC_EDIT1);     ::SetWindowText( ...

  2. ros move_base costmap 理解和实现动态窗口法避障

    以下大部分内容参考自 ros_by_example_hydro_volume_1.pdf local costmap 是怎么生成的?跟三维点云有什么关系? global costmap在没有全局地图下 ...

  3. Visual Studio 2013下我常用的两个插件

    随手记一下,我比较常用的两个插件,抛砖引玉. 代码高亮显示:SelectionHighlight.vsix 虚线插件:Indent Guides.vsix

  4. Codeforces Beta Round #25 (Div. 2 Only) A. IQ test【双标记/求给定数中唯一的奇数或偶数】

    A. IQ test time limit per test 2 seconds memory limit per test 256 megabytes input standard input ou ...

  5. l洛谷——P1211 [USACO1.3]牛式 Prime Cryptarithm

    P1211 [USACO1.3]牛式 Prime Cryptarithm 题目描述 下面是一个乘法竖式,如果用我们给定的那n个数字来取代*,可以使式子成立的话,我们就叫这个式子牛式. *** x ** ...

  6. POJ 2104 K-th Number (划分树)

                                                                K-th Number Time Limit: 20000MS   Memory ...

  7. RMI,socket,rpc,hessian,http比较

    SOCKET使用时可以指定协议TCP,UDP等: RIM使用JRMP协议,JRMP又是基于TCP/IP: RPC底层使用SOCKET接口,定义了一套远程调用方法: HTTP是建立在TCP上,不是使用S ...

  8. luogu P1821 [USACO07FEB]银牛派对Silver Cow Party

    题目描述 One cow from each of N farms (1 ≤ N ≤ 1000) conveniently numbered 1..N is going to attend the b ...

  9. ARM常用汇编指令介绍

    b     跳转指令(跳转范围为32Mb) bl    带返回地址的跳转,指令自动将下一条指令的地址复制到R14寄存器,然后跳转到指定地址去执行,执行完后返回到下一条指令处执行 pc    寄存器R1 ...

  10. ios中调用WCF

    例子比较简单 记录下思路 1.接口中定义 实体和方法声明 //登录信息        [OperationContract]        [WebInvoke(UriTemplate = " ...