jquery css 设置table的奇偶行背景色示例
<style>
.even{background:#FFF38F;}
.odd{background:#FFFFEE;}
.selected{background:#FF9900;}
</style>
<script type="text/javascript">
$(function(){
$("tr:odd").addClass("odd");
$("tr:even").addClass("even");
});
</script>
相关推荐
-
Extjs根据条件设置表格某行背景色示例
话不多说,贴上代码 html代码: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <link rel="stylesheet" type="text/css" href="../extjs3
-
利用JQuery和JS实现奇偶行背景颜色自定义效果
JQuery实现: 复制代码 代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Conten
-
如何用jquery控制表格奇偶行及活动行颜色
虽然jquery流行已经很多年了,一直都感觉很难,也没有花时间去学习它,只是偶尔哪天心血来潮了去看一点点,时隔多日又会忘得一干二净.最近用到表格奇偶行不同色,不得不去再看jquery,虽然感觉还是难,但已经不像以前一样无从下手了.做完后不得不来感叹一下jquery真是太牛了,不用自己再写一大堆javascript函数去实现了,简单几句轻松搞定. 先定义好表格的奇偶行样式,如下代码: 复制代码 代码如下: body { font-size:12px; } th { color: #FFFFFF;
-
一种表格背景色渐变效果的实现
无标题文档 .menu td{ font-size:12px; color:white; font-weight:bold; background-color:#336699; border:1px solid #336699; border:1px solid #336699; filter:blendtrans(duration=1); text-align:center;} function showfilter(obj){ var tds=obj.getElementsByTagName
-
表格奇偶行设置不同颜色的核心JS代码
这是一个比较实用的功能,设置奇偶行颜色不同后阅读表格数据的体验明显变好,否则数据会显得非常繁杂拥挤(当表格数据行多时体验尤为明显).只有当你自己真正做这方面的东西接触到时才有强烈的体会,反正我是刚刚经历了,留在这里备参考吧~ 核心JS脚本代码如下(table元素的id根据自己的情况调整,代码中的jquery-1.7.min.js可以到jquery的官网上下载) 复制代码 代码如下: <script src="jquery-1.7.min.js"></script>
-
javascript修改表格背景色实例代码分享
复制代码 代码如下: <html> <script> //点击当前选中行的时候设置当前行的颜色,同时恢复除当前行外的行的颜色及鼠标事件 function selectRow(target) { var sTable = document.getElementById("ServiceListTable") for(var i=1;i<sTable.rows.length;i++) //遍历除第一行外的所有行 {
-
jQuery实现表格奇偶行显示不同背景色 就这么简单
做表格的时候,经常要让奇偶行显示不同背景色,一来使表格显得更美观,二来使同行数据查找更快捷方便.通常我们是怎么实现的呢?就是在每个tr标签上加css样式. 代码如下所示: <html> <style type="text/css"> .odd { background-color:yellow; } .even { background-color:red; } </style> <body> <table border="
-
jquery css 设置table的奇偶行背景色示例
复制代码 代码如下: <style> .even{background:#FFF38F;} .odd{background:#FFFFEE;} .selected{background:#FF9900;} </style> 复制代码 代码如下: <script type="text/javascript"> $(function(){ $("tr:odd").addClass("odd"); $("t
-
layui 设置table 行的高度方法
找到layui渲染之后的网页的html代码, 找到table的行控件 在代码中,通过css渲染这个控件 <style type="text/css"> {# 设置table每一行的height #} .layui-table-cell { height: auto; line-height: 28px; } </style> 以上这篇layui 设置table 行的高度方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.
-
antd design table更改某行数据的样式操作
antd Table里面有一个rowClassName方法 表格行的类名 Function(record, index):string-->返回类型是String类型. 例子: import styless from './component/record.css';--->引入css样式. css: .csbsTypes{ font-family:微软雅黑, "Open Sans", "宋体"; font-weight: bold; } 代码: <
-
jquery实现奇偶行赋值不同css值
效果如下: 使用jquery我们可以轻松的实现上面效果,代码如下: 复制代码 代码如下: <html> <head> <title>jquery奇偶行css效果</title> <script src="http://img.jb51.net/jslib/jquery/jquery.js" type="text/javascript"></script> <style type=&quo
-
用javascript css实现GridView行背景色交替、鼠标划过行变色,点击行变色选中
加上鼠标点击选择(其实只是点击后变个颜色,"选择"这个词在这里不合适),顺便把这个直接应用到GridView上,如果是其他的控件,或者直接的HTML,稍加修改也可以用上,这里仅提供一个思路.虽然GridView使用AlternatingRowStyle提供了交替行背景色的问题,但这个东西用着实在不爽,看它生成到HTML的那个table,那叫一个乱啊. 下面是代码,注释应该还算比较详细,比较适合初学者,可以把下面两个文件的代码直接复制到你的项目中直接执行.最下面有文件的下载地址,也可以直
-
jQuery实现获取table中鼠标click点击位置行号与列号的方法
本文实例讲述了jQuery实现获取table中鼠标click点击位置行号与列号的方法.分享给大家供大家参考,具体如下: 先来看看运行效果: 具体代码如下: <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>www.jb51.net 鼠标点击位置行列号</title> </head> <bo
随机推荐
- SWT(JFace)体验之Sash(活动控件)
- JavaScript 事件对象的实现
- Python 爬虫多线程详解及实例代码
- 浅谈AngularJS中使用$resource(已更新)
- angular内置provider之$compileProvider详解
- JS实现从表格中动态删除指定行的方法
- ubuntu系统下禁用utc时间的设置方法
- 解读ASP.NET 5 & MVC6系列教程(16):自定义View视图文件查找逻辑
- JS实现从顶部下拉显示的带动画QQ客服特效代码
- Javascript连接多个数组不用concat来解决
- asp 在线备份与恢复sqlserver数据库的代码
- 在C#里面给PPT文档添加注释的实现代码
- C#生成漂亮验证码完整代码类
- Android编程开发实现TextView显示表情图像和文字的方法
- mysql 本地数据库如何从远程数据库导数据
- mysql处理海量数据时的一些优化查询速度方法
- Javascript 多浏览器兼容总结(实战经验)
- node.js中的buffer.length方法使用说明
- Python实现图片转字符画的示例代码
- 关于Ajax技术原理的3点总结