表格table中的td标签中的内容太多,影响整体外观,不美观。将一部分内容隐藏起来,用省略号代替。
招式:1、在table标签中加上style="table-layout: fixed;"
2、在内容多的td标签中加入style="white-space:nowrap;overflow: hidden;text-overflow:ellipsis"
代码如下:
<table width="600px;" style="table-layout: fixed;">
<tr>
<td width="20%">序号</td>
<td width="40%">描述</td>
<td width="40%">备注</td>
</tr>
<tr>
<td>1</td>
<td style="white-space:nowrap;overflow: hidden;text-overflow:ellipsis">
老地方科技阿打算理发卡东方打机来的快放假啊阿打算看风景阿打算理发卡东方</td>
<td>阿萨德发的是发的发水</td>
</tr>
</table>