使用：: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. Laravel-admin图片本地上传配置问题

    先打开config/filesystems.php 修改添加其中的 'admin' => [ 'driver' => 'local', 'root' => public_path(' ...

  2. tomcat中server.xml各项配置详解

     详见大佬的文章,乐于做大佬文章的搬运工. http://www.cnblogs.com/starhu/p/5599773.html

  3. windows通过gcc编译代码

    1.将gcc添加到环境变量 2.检查gcc是否安装成功 cmd下输入gcc –v 3.cd进入需要编译源文件的目录 4.dir查看当前目录下是否有需要编译的文件(linux下用ls) 5.编译文件(H ...

  4. 使用内存地址点亮LED—跟51单片机一样写代码教学（初步入门）

    51单片机点亮一个小灯 #include <rge52.h> sbit LED = P0^ void main(void) { P0 = 0XFE; // 总线操作 sfr P0 0X80 ...

  5. S03_CH13_ZYNQ A9 TCP UART双核AMP例程

    S03_CH13_ZYNQ A9 TCP UART双核AMP例程 13.1概述 ZYNQ中存在两个独立的ARM核,在很多应用场景中往往只需使用其中的1个核心即可.然而,对于复杂的设计,例如多任务,并行 ...

  6. 2019杭电多校一 A. Blank (dp)

    大意: 长为$n$的数组, 每个位置范围$[0,3]$, $m$个限制$(l,r,x)$表示$[l,r]$内有$x$种数, 求方案数. 维护每个数字最后一次出现位置, 暴力$DP$ 实现时有个技巧是把 ...

  7. VBA教程（一）

    VBA代表Visual Basic for Applications,它是一个来自Microsoft的事件驱动的编程语言. 现在它主要用于Microsoft Office应用程序,如MSExcel,M ...

  8. elementui 树控件只隐藏第三集菜单

    <!-- 必须属性:default-expanded-keys node-key --> <el-tree :default-expanded-keys='idArr' node-k ...

  9. sudo命令 sudoers文件

    超级用户权限 # Host alias specification Host_Alias HA = 192.168.1.1, 192.168.1.2 # User alias specificatio ...

  10. EF数据Linq方式查询

    using (var ctx = new NorthwindEntities()) { //单表查询SQL查询方式 //SELECT * FROM Customers AS c WHERE c.Cit ...