<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>能力表</title>
<style>
tbody tr:hover{
background-color: black;
color: #fff;
}
</style>
</head>
<body>
<table border="1" cellspacing="0" cellpadding="10" width="400px"><!--cellspacing 单元格间距-->
<caption>能力表</caption>
<thead>
<tr>
<th>编号</th><!--th 居中-->
<th>头像</th>
<th>姓名</th>
<th>能力</th>
<th>数值</th>
</tr>
</thead>
<tbody>
<tr>
<td >101</td><!--colspan="2" 列合并-->
<td>
</td>
<td>鲁班</td>
<td>防御</td>
<td>100</td>
</tr>
<tr>
<td rowspan="2">102</td><!--行合并-->
<td rowspan="2"></td>
<td rowspan="2">李白</td>
<td>攻击</td>
<td>100</td>
</tr>
<tr>
<td>防御</td>
<td>100</td>
</tr>
</tbody>
<tfoot>
<tr>
<td align="center" colspan="4">综合能力:</td>
<td >200</td>
</tr>
</tfoot>
</table>
</body>
</html>
HTML5基础(六)
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
- 文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
推荐阅读更多精彩内容
- 一 : 科普一分钟 //其实我有很多奇思妙想的点子,被困在脑海中,往往这就是学习的动力开发的时候有很多好看绚丽的...
- Web Socket和Web Worker只相差一个单词，但是，含义大不相同。 HTML5的Web Socket可...
