隔行换色table
<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的更多相关文章
- table隔行换色
以前做表格隔行换色,是在tr上添加不同的背景色,但在程序开发的过程需要做判断,不够方便,而且生成的代码也比较多,现在的需求逐渐修改为JQ去控制简洁的表格去显示隔行换色 <script type= ...
- table 表格隔行换色实现
table 表格隔行换色实现 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...
- jQuery实现table隔行换色和鼠标经过变色
一.隔行换色 $("tr:odd").css("background-color","#eeeeee"); $("tr:even& ...
- php29号小结(隔行换色······)
1.给表单加样式,可以用css.php与js.js这三种,其中最好用php与js,现在很推广用这种. css3样式隔行换色(table中) tr:nth-child(even){ background ...
- JQuery 表格 隔行换色 和鼠标滑过的样式
$(document).ready(function () { $(".Pub_TB tbody tr:even td").css("background-color&q ...
- JQuery案例一:实现表格隔行换色
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- Bootstrap3基础 table-striped 表格实现隔行换色(浅灰色与白色交替)
内容 参数 OS Windows 10 x64 browser Firefox 65.0.2 framework Bootstrap 3.3.7 editor ...
- jQuery应用实例2:表格隔行换色
这里是用JS实现的:http://www.cnblogs.com/xuyiqing/p/8376312.html 接下来利用上一篇提到的选择器利用jQuery实现: 发现原来多行代码这里只需要两行: ...
- JS应用实例4:表格隔行换色
HTML代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <t ...
随机推荐
- electron 安装使用
1.安装 node.js 链接:http://pan.baidu.com/s/1o7W7BIy 密码:y6od 一路next 我安装在F:\Program Files\node.js下 2.检查nod ...
- 我们为什么需要 lock 文件
前言 从 Yarn 横空出世推出 lock 文件以来,已经两年多时间了,npm 也在 5.0 版本加入了类似的功能,lock 文件越来越被开发者们接收和认可.本篇文章想从前端视角探讨一下我们为什么需要 ...
- dbgprint_Mine 调试输出
void DbgPrintf_Mine(char*pszFormat,...) { #ifdef _DEBUG char szbufFormat[0x1000]; char szBufFormat_G ...
- asp.net生成word文档服务器配置
一.asp.net生成word文档,布署到正式的服务器上就出现 错误:System.Runtime.InteropServices.COMException (0x800A1098 ...
- 洛谷——P1348 Couple number
P1348 Couple number 题目描述 任何一个整数N都能表示成另外两个整数a和b的平方差吗?如果能,那么这个数N就叫做Couple number.你的工作就是判断一个数N是不是Couple ...
- MySQL类型转换 使用CAST将varchar转换成int类型排序
--使用CAST将varchar转换成int类型排序 select distinct(zone_id) from guild_rank_info order by CAST(zone_id as SI ...
- Android之Activity的启动模式
启动模式有4种,分别为:1.standard(默认) -- 标准2.singleTop -- 单顶3.singleTask -- 单任务4.singleInstance: -- 单例 -- 如果 ...
- delphi 读取编译的version信息
在create中调用就可以了 unit About; interface uses Windows, Messages, SysUtils, Variants, Classes, Graphics, ...
- 使用ubifs格式的根文件系统---过程记录
配置内核,使其支持ubifs文件系统 1)Device Drivers --->Memory Technology Device (MTD) support --->UBI - Uns ...
- How to Use Auto Layout in XCode 6 for iOS 7 and 8 Development
The Auto Layout is available on the Storyboard for iOS or OS X development since XCode 5. But, I did ...