<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-cn">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title>网页标题</title>
<meta name="keywords" content="关键字列表" />
<meta name="description" content="网页描述" />
<link rel="stylesheet" type="text/css" href="" />
<style type="text/css">
td{
text-align:center;
border-color:black;
transition:all 1s;
}
td:nth-child(1){
background-color:red;
}
td:nth-child(2){
background-color:orange;
}
td:nth-child(3){
background-color:yellow;
}
td:nth-child(4){
background-color:green;
}
td:nth-child(5){
background-color:blue;
}
td:nth-child(6){
background-color:gray;
}
td:nth-child(7){
background-color:purple;
}
td:hover{
background-color:white;
}
</style>
<script type="text/javascript"></script>
</head>
<body>
<table align="center" border="1" rules="all" width="800">
<tr>
<td>星期一</td>
<td>星期二</td>
<td>星期三</td>
<td>星期四</td>
<td>星期五</td>
<td>星期六</td>
<td>星期日</td>
</tr>
<tr>
<td>语文</td>
<td>数学</td>
<td>外语</td>
<td>物理</td>
<td>化学</td>
<td>生物</td>
<td>历史</td>
</tr>
<tr>
<td>音乐</td>
<td>美术</td>
<td>政治</td>
<td>地理</td>
<td>吉他</td>
<td>钢琴</td>
<td>二胡</td>
</tr>
<tr>
<td>口琴</td>
<td>北京</td>
<td>上海</td>
<td>广州</td>
<td>深圳</td>
<td>天津</td>
<td>长沙</td>
</tr>
</table>
</body>
</html>
效果图：
不过好像不同颜色的同一行不能实现渐变。。。。。。
时间： 2024-07-29 14:20:17