<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. Dom4J读写xml

    解析读取XML public static void main(String[] args) { //1获取SaxReader对象 SAXReader reader=new SAXReader(); ...

  2. sql server判断数据库、表、列、视图是否存在

    1 判断数据库是否存在 if exists (select * from sys.databases where name = '数据库名') drop database [数据库名] 2 判断表是否 ...

  3. hdu 5138(水题)

    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=5138 反着来. #include<iostream> #include<cstdi ...

  4. Codeforces Round #277.5 (Div. 2) B. BerSU Ball【贪心/双指针/每两个跳舞的人可以配对,并且他们两个的绝对值只差小于等于1,求最多匹配多少对】

    B. BerSU Ball time limit per test 1 second memory limit per test 256 megabytes input standard input ...

  5. vue插槽slot的理解与使用

    一.个人理解及插槽的使用场景 刚开始看教程我的疑惑是为什么要用插槽,它的使用场景是什么,很多解释都是“父组件向子组件传递dom时会用到插槽”,这并不能很好的解决我的疑惑.既然你用了子组件,你为什么要给 ...

  6. JavaScript 函数调用的 this词法

    函数调用时的this实际上是在函数被调用时发生绑定,它指向什么完全取决于函数在哪里被调用. 特例:当函数作为构造函数被调用时,即使用new 来构造一个新对象,会自动执行以下操作: [1]创建一个新对象 ...

  7. Maximum Product of Word Lengths -- LeetCode

    Given a string array words, find the maximum value of length(word[i]) * length(word[j]) where the tw ...

  8. 韩国研发AI武器遭抵制,武器自带“头脑”将多可怕

    禁止自主武器的开发,事实上并不妨碍人工智能技术的发展,也不妨碍其被正常用于军事领域,其中的关键就在于,人类是否拥有控制权,能否在关键时刻对其进行关闭. 文 |郑伟彬 转自新京报专栏 4月4日,全球超过 ...

  9. 用kermit通过串口往nandflash任意地址里烧写任何文件!

    1.安装kermit #apt-get install ckermit 2.使用kermit之前,在用户宿主目录下(/home/用户名/)创建一个名为.kermrc的配置文件,内容如下 : set l ...

  10. Excel设置下拉菜单并隐藏下拉菜单来源单元格内容

    一.问题来源 做实验室的进展统计表,老师让加上开始时间和完成时间,时间格式:周几_上午(下午.晚上). 这样就可以了做下拉菜单,方便填写,而且格式统一,方便查看. 二.解决办法 2.1 下来菜单 红框 ...