demo_07选择器练习
2024-08-22 03:25:34
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style type="text/css">
body{
background-color: #bbc;
}
header{
width: 100%;
text-align: center;
height: 50px;
margin-top: 20px;
line-height: 50px;
font-family: "微软雅黑";
font-size: 25px;
color: #DDFFFF;
letter-spacing: 2px;
}
table{
margin: 100px auto;
}
table td{
width: 100px;
height: 30px;
text-align: center;
color: #333;
}
tr:first-child{
background-color: #ddd;
}
tr:nth-last-child(2){
background-color: #def;
}
tr:nth-child(2){
background-color: #fde;
}
tr:nth-child(3){
background-color: #dff;
}
tr:last-child{
background-color: #fbc;
}
td:nth-last-child(4){
background-color: #bcf;
}
tr:nth-child(2)>td:nth-child(2){
background-color: #dbf;
}
tr:nth-child(4) td:nth-child(3){
background-color: #bac;
}
td[style]{
background-color: #dac;
}
td[class~="name"]{
background-color: #efadcb;
}
td[class*="set"]{
background-color: #defacb;
}
td[class*="set"]+td+td{
background-color: #3d21bc;
}
</style>
</head>
<body>
<header>
CSS3选择器练习
</header>
<section>
<table cellpadding="0" cellspacing="3">
<tr>
<td>11</td>
<td class="name set">12</td>
<td>13</td>
<td>14</td>
<td>15</td>
<td>16</td>
<td>17</td>
</tr>
<tr>
<td>21</td>
<td>22</td>
<td>23</td>
<td>24</td>
<td>25</td>
<td class="name">26</td>
<td>27</td>
</tr>
<tr>
<td>31</td>
<td>32</td>
<td>33</td>
<td class="name">34</td>
<td>35</td>
<td>36</td>
<td>37</td>
</tr>
<tr>
<td>31</td>
<td>32</td>
<td>33</td>
<td>34</td>
<td>35</td>
<td>36</td>
<td style="">37</td>
</tr>
<tr>
<td>31</td>
<td>32</td>
<td>33</td>
<td>34</td>
<td>35</td>
<td>36</td>
<td>37</td>
</tr>
</table>
</section>
</body>
</html>
最新文章
- compositionEnd 和 input 事件（中文输入法问题）
- .NET Framework介绍
- [IOS 实现TabBar在Push后的隐藏 以及 两级Tabbar的切换]
- Redis学习笔记三：多机数据库的实现
- 修改SQL Server 2005 数据库文件名字
- 再次讲解js中的回收机制是怎么一回事。
- android的jni
- 超级强大的vim配置（vimplus）
- python运维开发(十七)----jQuery续(示例)web框架django
- 通信协议：HTTP、TCP、UDP（转）
- [转载]七天学会NodeJS
- Java Web - HTML 常用标签
- 201521123091 《Java程序设计》第5周学习总结
- java12 - 正则表达式
- C++常用的文件操作路径函数
- EasyUI datagrid 一个可以 直接运行例子一个文件 六
- Java经典问题：传值与传引用？
- 2.1 C++类的定义和声明
- regex_match
- ES6学习（一）搭建环境