html中table遮罩一行
最近接到这样一个需求，要求在table表中按照一定规则给一行加上遮罩层，防止用户输入
因为是采用模板引擎加载的情况，所以可以直接采用css的样式处理，本来最开始打算tr中放div的，但是没想到直接飘出来了…所以后来直接使用td加上绝对定位即可实现
代码如下：
<html>
<head>
<meta charset='utf8' />
<title>测试</title>
</head>
<style>
.mask {
position: absolute;
background-color: rgba(0, 0, 0, 0.8);;
height: 25px;
width: 200px;
left: 0;
color: white;
}
</style>
<body>
<table>
<tr>
<th>abas</th>
<th>abasSDF</th>
<th>abasAAA</th>
</tr>
<tr>
<td>sdfasdf</td>
<td>sdfasdf</td>
<td>sdfasdf</td>
<td class="mask">遮罩层</td>
</tr>
<tr>
<td>absd</td>
<td>asf</td>
<td>werwr</td>
</tr>
<tr>
<td>absd</td>
<td>asf</td>
<td>werwr</td>
<td class="mask">遮罩层</td>
</tr>
</table>
</body>
</html>
核心代码在于 mask这个样式，采用绝对于tr的定位，便可实现遮罩一行的效果