当屏幕宽度小于设置em单位宽度总和时 会有等比缩小的效果 可以实现一些响应式的布局
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<table class="table-col-border">
<thead class="thead1" style="font-size: 10px;">
<th style="width: 15em; height: 5em; ">标准号</th>
<th style="width: 15em; height: 5em; ">状态</th>
<th style="width: 15em; height: 5em; ">中文题名</th>
<th style="width: 15em; height: 5em; ">英文题名</th>
<th style="width: 15em; height: 5em; ">发布日期</th>
<th style="width: 15em; height: 5em; ">实施日期</th>
<th style="width: 15em; height: 5em; ">操作</th>
</thead>
<tbody>
<tr class="tbody1">
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
</tr>
</tbody>
<div style="width: 3rem;height: 3rem;background-color: skyblue;">
</div>
</table>
</body>
</html>
<script>
</script>
<style>
.tbody1{
text-align: center;
}
</style>