:nth-child(n) 选择器匹配属于其父元素的第 N 个子元素，不论元素的类型。n 可以是数字、关键词或公式。


下面的例子, 设置表格的奇偶行背景颜色不同；单独设置表格的第1列背景颜色不同。




 <!DOCTYPE html>

 <html>

    <head>

         <style type="text/css">

             table{

                 height: 200px;

                 width:400px;

                 border:2px solid  green;

             }

             td{

                 border:1px solid;

             }

             tr:nth-child(2n){

                 background:#00CCCC;

             }

             tr td:nth-child(1){

                 background:#FFCCCC;

             }

         </style>

     </head>

     <body>

         <table>

             <tr>

                 <td>1</td> <td>2</td> <td>3</td>

             </tr>

             <tr>

                 <td>1</td> <td>2</td> <td>3</td>

             </tr>

             <tr>

                 <td>1</td> <td>2</td> <td>3</td>

             </tr>

             <tr>

                 <td>1</td> <td>2</td> <td>3</td>

             </tr>

         </table>

     </body>

 </html>




效果:




可以参考:


http://www.w3school.com.cn/cssref/selector_nth-child.asp
												


											
html table奇偶行颜色设置 (CSS选择器)的更多相关文章
	

    
								
  1. flex 4 datagrid 奇偶行颜色设置
		
    <s:DataGrid width="100%" height="100%" alternatingRowColors="[#ffFFff,#e ...
    
		
    2. 
						
  2. table中嵌套table，如何用jquery来控制奇偶行颜色
		
    总是要趁着自己还有记忆的时候,把该记录下来的都记录下来,着实是不敢恭维自己的记性. 相信很多时候,我们前端人员,经常会用到table里面的某个td中还嵌套着table,而这个时候还总要去弄奇偶行的颜色 ...
    
		
    3. 
						
  3. table行颜色设置
		
    function renderingTable(obj){    $(obj).each(function(){        //设置奇数行颜色        $(this).find(" ...
    
		
    4. 
						
  4. 如何修改antd中表格的表头样式和奇偶行颜色交替
		
    在做antd表格时通常会用到table组件,但是table的表头时给定的,那么怎么修改表头的颜色呢? 这里用的时less的写法,在全局环境中写,所有的table表头都会变成自己定义的颜色 定义好表头的 ...
    
		
    5. 
						
  5. jquery实现奇偶行赋值不同css值
		
    <html> <head> <title>jquery奇偶行css效果</title> <script src="../../jquer ...
    
		
    6. 
						
  6. table奇偶行设置颜色代码
		
    
		
    7. 
						
  7. 当鼠标经过表格数据行时颜色不同且奇偶行颜色也不同 (纯CSS)
		
    <!DOCTYPE html> <!-- To change this license header, choose License Headers in Project Prope ...
    
		
    8. 
						
  8. Gridview中奇偶数行颜色设置
		
    在gridview中的RowDataBound事件里面写 switch (e.Row.RowType) {case DataControlRowType.Header: e.Row.BackColor ...
    
		
    9. 
						
  9. tab奇偶行颜色交替+插件
		
    (function($){ $.fn.tableUI=function(options){ var defaults={ evenRowclass:"evenRow", oddro ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. 深入分析Spring Boot2，解决 java.lang.ArrayStoreException异常
			
    将某个项目从Spring Boot1升级Spring Boot2之后出现如下报错,查了很多不同的解决方法都没有解决: Spring boot2项目启动时遇到了异常: java.lang.ArraySt ...
    
			
    2. 
						
  2. [转]eclipse转idea, 快捷键设置
			
    原文地址: eclipse转idea, 快捷键设置   设置快捷键的途径: 打开idea的配置,找到Keymap,设置为eclipse 另外还要手动设置某些快捷键 上下移动 点击类打开 代码提示 查询 ...
    
			
    3. 
						
  3. 【11.1校内测试】【快速幂DP】【带权并查集】【模拟】
			
    Solution $jzy$大佬用了给的原根的信息,加上矩阵快速幂150行QAQ 然而$yuli$大佬的做法不仅好懂,代码只有50行! 快速幂的思想,把m看成要组成的区间总长度,每次将两段组合得到新的 ...
    
			
    4. 
						
  4. bzoj 4004 向量拟阵
			
    题解RT. eps = 1e-10 WrongAnswer eps = 1e-5 Accepted /************************************************* ...
    
			
    5. 
						
  5. group by 字符串合并 有关问题
			
    group by 字符串合并 有关问题 group by 字符串合并 问题 如下表: TYPE NAME C123 张三 C189 李四 C123 王一 C123 丁丁 C189 刘某 查询出如下形式 ...
    
			
    6. 
						
  6. Windows平台开发Mapreduce程序远程调用运行在Hadoop集群—Yarn调度引擎异常
			
    共享原因:虽然用一篇博文写问题感觉有点奢侈,但是搜索百度,相关文章太少了,苦苦探寻日志才找到解决方案. 遇到问题:在windows平台上开发的mapreduce程序,运行迟迟没有结果. Mapredu ...
    
			
    7. 
						
  7. Spring boot整合jsp
			
    这几天在集中学习Spring boot+Shiro框架,因为之前view层用jsp比较多,所以想在spring boot中配置jsp,但是spring boot官方不推荐使用jsp,因为jsp相对于一 ...
    
			
    8. 
						
  8. 【shell学习笔记】curl命令总结
			
    2014-12-16 20:34 文思海辉 =========== CURL命令总结 1. 下载 curl -o [文件名称] www.baidu.com 2. 显示 HTTP request头信息  ...
    
			
    9. 
						
  9. CRC 详解
			
    http://www.barrgroup.com/Embedded-Systems/How-To/Additive-Checksums CRC Series, Part 1: Additive Che ...
    
			
    10. 
						
  10. google打不开怎么办？谷歌打不开的解决方法
			
    www.ggfwzs.com 我是在这里安装插件,安装后可以打开google http://jingyan.baidu.com/article/b907e627d67ad646e6891c52.htm ...
    
			
    11.