表格(Table)隔行变色

在ASP.NET的Repeater控件,实现隔行变色,是极简单的事情。因为它有ListItemType.Item和ListItemType.AlternatingItem模版。
如果在普通的表格(Table)来实现隔行变色,就得使用css样式与jQuery来解决。
先来看看原始的表格样式:
表格(Table)隔行变色

打开视图:

表格(Table)隔行变色

在视图中,添加样式:
表格(Table)隔行变色


由于此视图是使用.getJSON()异步加载数据,因此得在加载完成之后,得马上给这个动态的表格添加上面的样式:
表格(Table)隔行变色

网页运行后的效果:
表格(Table)隔行变色

更多相关文章
  • /*table隔行变色*/    #customers tr {        background:#ffffff;    }         #customers tr:nth-child(2n+1) {            background: #A7C942;        }     ...
  • 以前以为Table隔行变色只能通过js和后台逻辑代码实现,但是今天帮同事处理Table隔行变色时发现css里面也能写逻辑代码:直接上代码(复制到本地运行查看效果):Table隔行变色
  • 隔行变色表格隔行变色+LI浮动隔行变色
    第一篇文章哈 随便写写表格隔行变色,一个很普通的js效果... 但是我非常不喜欢用table,一是代码累赘,再是...我通常用li写信息列表.例如相册列表,通常是用浮动排版,或者block-inline...一行有好几个li元素这时要隔行变色的话...首先假如总共有7个li,一行有3个li,那最后一 ...
  • 该插件乃本博客作者所写,目的在于提升作者的js能力,也给一些js菜鸟在使用插件时提供一些便利,老鸟就悠然地飞过吧. 此插件旨在实现表格隔行变色,且鼠标移动在表格的某一行上时,该行能高亮显示.整体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTM ...
  • ReportingService通过RowNumber函数获取行号和生成隔行变色样式
    以前一直没有搞明白SSRS里面的RowNumber函数到底该怎么用,所以一直没有很好的办法在SSRS中的表格上实现隔行变色的样式,实现隔行变色的关键就是获取表格中每一行的行号.在最近了解了下这个函数,发现RowNumber函数“在某些时候”获取行号还是非常有用的,之所以说“某些时候”是因为RowNu ...
  • jquery实现的隔行变色代码实例: 隔行变色效果在大量的网站应用,尤其是表格或者新闻列表之类的结构,可以有效增强网站的辨识度,更为人性化,下面通过一个简单的实例介绍一下它的实现原理,至于它的美观度这里就不讲究了,代码实例如下: ){ $(this).css(odd); } else{ $(this ...
  • Action代码: [php]   public function index(){   $prod = I("get.prod_en");   $id = I("get.id", 0, "int");   if ($prod == &qu ...
  • 支持键盘上下键的隔行变色代码:隔行变色代码非常的常用,尤其是在新闻列表形式的场景,不过大多数都只是支持鼠标效果,而对键盘的上下键并不支持.下面就提供一段支持上下键的隔行变色效果代码.代码如下: ); }) </script> </head> <body> < ...
一周排行
  • 大蛇程序#define _CRT_SECURE_NO_WARNINGS#include<stdio.h>#include <stdlib.h>#define  M 10void main(){ ...
  • 修改注册表:打开注册表“HKCY_CURRENT_USER\Software\Microsoft\Office\{Ver}\Outlook\Secerity” (注:{Ver}是Office的版本号,例如:0.0)然 ...
  • 离小马哥公布的为期一年的腾讯开放战略还有不到几个月的时间,那么腾讯的开放战略进行得如何了?外界是如何看待腾讯这一年的表现的?小马哥又将如何向媒体和外界公布自己的开放战略进展情况?腾讯云操作系统 近日,腾讯的动作连连, ...
  • 移动增值业务(Mobile Added Value Service)就是在移动通信网上开发运行除了语音等基本业务以外的服务类型.目前国际上通常把移动增值业务概括为两大类,即移动话音增值业务和移动数据增值业务.智能网( ...
  • 64位处理器是指可以对虚拟地址空间(virtual address space)进行64位寻址的处理器.64位处理器可以以64位格式存贮数据,并可以对64位操作数执行数学运算操作.另外,处理器的通用寄存器(GPRs) ...
  • 使用LEFT JOIN可以实现.例如有两个表,Table1 和 Table2,分别与Table3和Table4的某项关联.想把Table1和Table2的关联数据同时输出到一个Select语句,可以:SELECT * ...
  • CSS代码: .ani_dot { font-family: simsun; } :root .ani_dot { display: inline-block; width: 1.5em; vertical-alig ...
  •          金笛邮件中使用tomcat进行的web支持,这个时候通过网页进行收发邮件的时候就牵扯到一个邮件加密的性质.这个时候就要用到tomcat的加密传输了.        给Tomcat配置HTTPS1.生 ...
  • 这个是在网上读到的一篇文章,觉得很好.希望我们这些网络爱好者及其追求着的,能够看看!    目前一个很明显的问题阴魂不散的笼罩在"网络工程师"这个行业.问题的根本是对网络工程师职业前途的严重误解. ...
  • 收件人管理" />2在属性中选择组织选项卡,管理员可以根据不同员工的属性来填写他们在公司的所属职位和部门:其中直接下属内容是由系统自动生成最后单击应用,再单击确定完成更新收件人管理" /&g ...