使用：:nth-child 选择器


tr:nth-child(odd) {

    background-color: #ccc;

}

tr:nth-child(even) {

     background-color: #F9F9F9;

}

　　

odd 奇数行
even 偶数行

效果：
 

纯 css 控制隔行变色的更多相关文章

  1. js控制固定div和随屏滚动div兼容多浏览器和纯css控制（来自网络）

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. 纯CSS控制背景图片100%自适应填充布局

    https://blog.csdn.net/wd4java/article/details/50537562 解决:   html,body{height: 100%;width: 100%;marg ...

  3. 纯css控制文字2行显示多余部分隐藏

    在编写页面的时候,经常遇到一些地方的文字显示1行,多余的文字隐藏,这样显示1行的很好控制: css代码如下: white-space: nowrap; overflow: hidden; text-o ...

  4. 纯css控制－表格表头固定,内容多时滚动内容

    <html> <head> <style type="text/css"> * { margin: 0; padding: 0; } /*所有内 ...

  5. 如何用纯 CSS 创作一个变色旋转动画

    效果预览 在线演示 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/ejZWKL 可交互视频 ...

  6. 前端每日实战：81# 视频演示如何用纯 CSS 创作一个变色旋转动画

    效果预览 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/ejZWKL 可交互视频 此视频是可 ...

  7. [js插件开发教程]一步步开发一个可以定制配置的隔行变色小插件

    隔行变色功能,不用js,直接用css伪类就可以做,这个实例可以作为js插件开发很好的入门级实例.本文实现的隔行变色包括以下功能: 1,支持2种常用结构共存( div元素 和 表格类型 ) 2,一个页面 ...

  8. JavaScript 实现表格隔行变色

    JavaScript 实现表格隔行变色 版权声明:未经授权,严禁分享! 构建界面 界面HTML代码 <style> #data,th,td{ border: 1px solid #aaaa ...

  9. 纯css实现长宽等比例的div

    现代网站页面基本都需要响应式,一个div的长宽往往我们都设置为百分之多少,这个百分之是相对于父容器动态计算的 这样在浏览器宽度变化之后,我们的元素也能自动更新长宽.例如:我们在页面上摆了一个div,这 ...

随机推荐

  1. 开始使用 git（配置+常用命令）

    ▶ 注意 页面显示问题: -- 是两个短横线 - 是一个横短线 由于显示问题导致两个短横线之间没有空格,看起来像是一条横线,实则是两条短横线 ▶ git 常用命令 ◆ git add ● git ad ...

  2. 位带操作—GPIO输出和输入

    GPIOC->ODR |=(0<<2);  // 总线操作,即操作整个寄存器. 在51单片机中 P0=0xFE;   //总线操作. sbit LED1=P0^0;  //位操作,即 ...

  3. 在一台服务器上启动多个Broker

    1:把整个conf文件夹复制一份,比如叫做conf22:修改里面的activemq.xml文件(1)里面的brokerName 不能跟原来的重复(2)数据存放的文件名称不能重复,比如:<kaha ...

  4. SCALA基础知识学习

    注:本文只说和Java不同的地方. 总结自: Scala详细教程 Scala教程 scala基础语法 Scala 与 Java 的最大区别是:Scala 语句末尾的分号 ";" 是 ...

  5. （三）CXF之处理输入参数与输出类型为复杂类型的webService服务

    一.需求 调用webService服务,把用户名和密码封装为用户对象作为参数,返回该用户所用友的角色列表. 二.发布服务 2.1 编写服务接口 @WebService public interface ...

  6. 再谈 pm2

    比forever好用,对Ubuntu和centos更友好,性能监控.自动重启.负载均衡,适用于laas场景, 总之,pm2是一个带有负载均衡功能的Node应用的进程管理器,可以实现在云服务器上,对no ...

  7. Rider开发开发.NET Framework 4.5项目遇到的一些问题

    使用rdier自带resharper功能,蛮爽的但是编译旧的项目时一直报错:Invalid option 'portable' for /debug; must be full or pdbonly' ...

  8. py datetime

    python datetime模块strptime/strptime format常见格式命令- [python]2011-12-23   版权声明:转载时请以超链接形式标明文章原始出处和作者信息及本 ...

  9. opencv-04--图像金字塔

    图像金字塔被广泛应用于各种视觉应用中.图像金字塔是一个图像集合,集合中图像都源于同一个原始图像,而且是通过对原始图像连续降采样获得,直到达到某个中止条件才停止降采样.(当然,降为一个像素肯定是中止条件 ...

  10. JS中的兼容性问题

    事件对象兼容        window.event只能在IE下运行,而不能在Firefox下运行,这是因为Firefox的event只能在事件发生的现场使用.Firefox必须从源处加入event作 ...