当前位置： 移动技术网 > IT编程>开发语言>JavaScript > layui表格内容溢出的解决方法

layui表格内容溢出的解决方法

2019年09月15日  | 移动技术网IT编程  | 我要评论

引言，我做文章管理的时候，引入的是layui的表格样式，但是里面的内容溢出无法隐藏，后来我采用了往td里面加了个<div></div>

然后设置一下样式就可以了。


 <table class="layui-table">
 <colgroup>
 <col width="100">
 <col width="150">
 <col>
 </colgroup>
 <thead>
 <tr>
  <th>序号</th>
  <th>文章标题</th>
  <th>文章内容</th>
  <th>发布时间</th>
  <th>发布人</th>
  <th>操作</th>
 </tr> 
 </thead>
 <tbody>
 <c:foreach items="${pageinfo.list}" var="a">
 <tr style="height:auto;">
  <td class="lid">${a.aid}</td>
  <td>${a.atitle }</td>
  <td class="ac" style=""><div style="width:500px;
overflow:hidden; 
white-space:nowrap; 
text-overflow:ellipsis;">${a.acontent}</div></td>
  <td><fmt:formatdate type="both" datestyle="long" timestyle="long" value="${a.atime}" /></td>
  <td>${a.whorelease}</td> 
  <td>
  <button class="layui-btn-danger layui-btn layui-delete"><i class="layui-icon"></i></button></td> 
 </tr>
 </c:foreach>
 
 </tbody>
</table>

以上这篇layui表格内容溢出的解决方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持移动技术网。

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网