Web中关于表格rules属性的运用
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>企业员工薪水绩效表</title>
</head>
<!-- 一个表格包含多行，一行包含多个单元格 -->
<body>
<table width="400" border="1" rules="groups"> #这里我按照书上的例子用的groups
<caption>
企业员工薪水绩效表
</caption>
<thead>
<tr>
<th>员工编号</th>
<th>员工岗位</th>
<th>基本工资</th>
<th>本月绩效</th>
</tr>
</thead>
<tbody>
<tr>
<td>YE0016</td>
<td>Java高级工程师</td>
<td>6000</td>
<td>3000</td>
</tr>
<tr>
<td>YE0021</td>
<td>Java程序员</td>
<td>3000</td>
<td>2500</td>
</tr>
</tbody>
<tbody>
<tr>
<td>YE0062</td>
<td>Web前端设计师</td>
<td>5500</td>
<td>2000</td>
</tr>
<tr>
<td>YE0081</td>
<td>测试人员</td>
<td>3000</td>
<td>2000</td>
</tr>
</tbody>
<tfoot>
<tr>
<td></td>
<td></td>
<td>总计</td>
<td>10W</td>
</tr>
</tfoot>
</table>
</body>
</html>
rules = “groups”:
很明显这里是对tbody的内容进行分界线分割
rules = “rows”:
这里是每一个 tr 都加了一条分割线
rules = “cols”：
这里是对每一列即 td 进行的竖向分割
rules = “all”:
顾名思义，就是前面的每种都加进去，每行每列都分割
rules = “none”:
none就是每行每列都不分割
转载：https://blog.csdn.net/wzy1414/article/details/114892873
查看评论