当h5页面横向不能滚动，如何优雅的显示表格数据

背景
h5项目中经常会出现“使用协议/隐私政策”。这些内容一般都是服务端给返回的富文本。

问题
一般协议中难免会出现表格等形式展示更多的信息。但是对于产品人员或者法务人员给我们的富文本展示出来的表格。已经远远的超出了页面内容的宽度。

处理方式
如果前端人员为了完全的展示表格，要么允许横向滚动，要不自己处理富文本中table标签。

方案一：页面允许横向滚动，虽然表格可以展示完全，但是页面会显得特别“宽松”，因为除表格外的内容是和页面一样宽的。
方案二：我们可以针对table标签进行处理，处理成table宽度和页面一样宽，表格内容折行处理。

table {
   table-layout: fixed; // 表格宽度设置为当前父级宽度
   td {
     // 内容折行 可以使链接折行
     word-wrap: break-word;
     white-space: normal;
     word-break: break-all;
     text-align: left;
   }
 }

备注
会有人说，可以给table标签包裹一个div。给div设置横向滚动，也可以使表格滚动起来。

<div style="width: 100%; overflow: auto;">
	<table>
		表格内容
	</table>
</div>

当时内容是产品/法务人员编写的。所以还是咱们自己处理了。