JQ表格隔行换色
<style type="text/css">
html, body {
margin: 0;
padding: 0;
font-size: 15px;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
} ul {
list-style: none;
border: 1px solid #5bc0de;
width: 600px;
margin: 0 auto;
padding: 0px;
} li {
padding: 10px 30px;
cursor: pointer;
} .c1 { /*奇数行颜色*/
background-color: #5bc0de;
} .c2 { /*偶数颜色*/
background-color: #f7e1b5;
} .c3 { /*移入颜色*/
background-color: #999;
}
</style>
</head>
<body>
<ul>
<li>A</li>
<li>B</li>
<li>A</li>
<li>B</li>
<li>A</li>
<li>B</li>
<li>A</li>
<li>B</li>
</ul>
<script type="text/javascript">
$("li:even").addClass("c2");
$("li:odd").addClass("c1");
</script>
JQ :even选择器代表着选择偶数行
JQ :odd 代表选择奇数行
JQ表格隔行换色的更多相关文章
- jQuery学习(四)——使用JQ完成表格隔行换色
1.步骤分析: 第一步:引入jquery的类库 第二步:直接写页面加载函数 第三步:直接使用jquery的选择器(组合选择)拿到需要操作的元素(奇数行和偶数行) 第四步:分别使用CSS的方法(css( ...
- JQuery案例一：实现表格隔行换色
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- jQuery实现表格隔行换色且感应鼠标高亮行变色
jQuery插件实现表格隔行换色且感应鼠标高亮行变色 http://www.jb51.net/article/41568.htm jquery 操作DOM的基本用法分享http://www.jb51. ...
- table 表格隔行换色实现
table 表格隔行换色实现 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...
- jQuery应用实例2：表格隔行换色
这里是用JS实现的:http://www.cnblogs.com/xuyiqing/p/8376312.html 接下来利用上一篇提到的选择器利用jQuery实现: 发现原来多行代码这里只需要两行: ...
- JS应用实例4：表格隔行换色
HTML代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <t ...
- jQuery插件实现表格隔行换色且感应鼠标高亮行变色
实现表格隔行换色,且感应鼠标行变色的方法有很多,在本文将为大家介绍的是使用jQuery插件来实现,具体如下 看代码: : css代码:
- javascript 表格隔行换色
用到的知识点: 获取表格元素 tbody 和 rows都是有索引的 这里我们只有一组tbody所以 索引是0 偶数行 索引取余2为0 奇数行 索引取余2不为0 通过 遍历行索引设置相应的颜色. < ...
- JQuery 表格 隔行换色 和鼠标滑过的样式
$(document).ready(function () { $(".Pub_TB tbody tr:even td").css("background-color&q ...
随机推荐
- MD5加密Util
目录 (1)需要导入的包 (2)MD5Util类 (3)使用举例 (1)需要导入的包 <dependency> <groupId>org.apache.commons</ ...
- MongoDB分片群集的部署（用心描述，详细易懂）！！
概念: MongoDB分片是使用多个服务器存储数据的方法,以支持巨大的数据存储和对数据进行存储 优势: 1.减少了每个分片需啊哟处理的请求数,群集可以提高自己的存储容量和吞吐量 2.减少了每个分片存储 ...
- 项目分层-----MVC
MVC设计模式:modle层,view层,controller层 以前学习的servlet其实就是一个java类,或者说经过规范的java类,实际进行跳转时,还是要在web.xml文件中配置才能正常跳 ...
- a标签伪类选择器以及伪元素:hover的案例
1.通过我们的观察发现a标签存在一定的状态1.1默认状态, 从未被访问过1.2被访问过的状态1.3鼠标长按状态1.4鼠标悬停在a标签上状态 2.什么是a标签的伪类选择器?a标签的伪类选择器是专门用来修 ...
- HTML 练习清除浮动 :after
为 clearfix 类所在的 div 内部最后处添加一个 div 标签,内容为 . ,高度为0, 隐藏 <!DOCTYPE html> <html lang="en&qu ...
- win10 DVWA下载安装配置（新手学渗透）
电脑重装系统了,需要重新装一下渗透测试的学习环境DVWA,借此机会就跟大家讲一下DVWA的安装过程,因为不同的电脑配置.环境不同,在我的电脑上按照我这个安装教程是一次性就安装好了的.如果安装的时候遇到 ...
- [FromBody]与[FromForm]区别
[FromBody]与[FromForm]区别 1,fromBody:在cation方法传入参数后添加[frombody]属性,参数将以一个整体的josn对象的形式传递. 2,fromform:在ca ...
- this指针的初运用
this一般运用场景: 1.位于函数中,谁调用指向谁 var make = "Mclaren"; var model = "720s" function ful ...
- 神奇的选择器 :focus-within
CSS 的伪类选择器和伪元素选择器,让 CSS 有了更为强大的功能. 伪类大家听的多了,伪元素可能听到的不是那么频繁,其实 CSS 对这两个是有区分的. 有个错误有必要每次讲到伪类都提一下,有时你会发 ...
- MySQL教程之concat以及group_concat的用法
本文中使用的例子均在下面的数据库表tt2下执行: 一.concat()函数 1.功能:将多个字符串连接成一个字符串. 2.语法:concat(str1, str2,...) 返回结果为连接参数产生的字 ...