htmltable奇偶⾏颜⾊设置(CSS选择器):nth-child(n) 选择器匹配属于其⽗元素的第 N 个⼦元素,不论元素的类型。n 可以是数字、关键词或公式。
下⾯的例⼦, 设置表格的奇偶⾏背景颜⾊不同;单独设置表格的第1列背景颜⾊不同。
1<!DOCTYPE html>
2<html>
3<head>
4<style type="text/css">
5            table{
css设置表格滚动条6                height: 200px;
7                width:400px;
8                border:2px solid  green;
9            }
10
11            td{
12                border:1px solid;
13            }
14
15            tr:nth-child(2n){
16                background:#00CCCC;
17            }
18
19            tr td:nth-child(1){
20                background:#FFCCCC;
21            }
22</style>
23</head>
24<body>
25<table>
26<tr>
27<td>1</td><td>2</td><td>3</td>
28</tr>
29<tr>
30<td>1</td><td>2</td><td>3</td>
31</tr>
32<tr>
33<td>1</td><td>2</td><td>3</td>
34</tr>
35<tr>
36<td>1</td><td>2</td><td>3</td>
37</tr>
38</table>
39</body>
40</html>
效果:
可以参考:
www.w3school/cssref/selector_nth-child.asp

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。