快捷導(dǎo)航

layui表格內(nèi)容溢出的解決方法

更新時(shí)間：2019年09月06日 09:02:26 作者：逍遙游666

今天小編就為大家分享一篇layui表格內(nèi)容溢出的解決方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧

引言，我做文章管理的時(shí)候，引入的是layui的表格樣式，但是里面的內(nèi)容溢出無法隱藏，后來我采用了往td里面加了個(gè)<div></div>

然后設(shè)置一下樣式就可以了。


 <table class="layui-table">
 <colgroup>
 <col width="100">
 <col width="150">
 <col>
 </colgroup>
 <thead>
 <tr>
  <th>序號(hào)</th>
  <th>文章標(biāo)題</th>
  <th>文章內(nèi)容</th>
  <th>發(fā)布時(shí)間</th>
  <th>發(fā)布人</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">&#xe640;</i></button></td> 
 </tr>
 </c:forEach>
 
 </tbody>
</table>

以上這篇layui表格內(nèi)容溢出的解決方法就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

如何確保JavaScript的執(zhí)行順序之實(shí)戰(zhàn)篇
我曾在文章《如何在多個(gè)頁面使用同一個(gè)HTML片段 - 續(xù)》的最后提到JavaScript順序執(zhí)行的特性。雖然現(xiàn)代瀏覽器可以并行的下載JavaScript（部分瀏覽器），但考慮到JavaScript的依賴關(guān)系，他們的執(zhí)行依然是按照引入順序進(jìn)行的。
2011-03-03
JS前端攻堅(jiān)淺析instanceof實(shí)現(xiàn)原理
這篇文章主要為大家介紹了JS前端攻堅(jiān)淺析instanceof實(shí)現(xiàn)原理詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
2022-12-12
教你javascript如何獲取對(duì)象的key和value
獲取對(duì)象所有key的方法，需要使用?Object.keys(obj)?方法,Object.keys(obj)方返回一個(gè)數(shù)組，這個(gè)數(shù)組包含obj對(duì)象中的所有key，這篇文章主要介紹了javascript如何獲取對(duì)象的key和value,需要的朋友可以參考下
2022-12-12
JavaScript this關(guān)鍵字指向常用情況解析
這篇文章主要介紹了JavaScript this關(guān)鍵字指向常用情況解析,文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
2020-09-09
學(xué)做Bootstrap的第一個(gè)頁面
這篇文章主要為大家介紹了學(xué)做Bootstrap的第一個(gè)頁面，這是學(xué)bootstrap的第一個(gè)頁面，還有許多需要改進(jìn)的地方，希望大家批評(píng)指正
2016-05-05
前端使用xlsx導(dǎo)出數(shù)據(jù)生成Excel文件的全過程
這篇文章主要給大家介紹了關(guān)于前端使用xlsx導(dǎo)出數(shù)據(jù)生成Excel文件的相關(guān)資料,最近在做項(xiàng)目中,后端偷懶不做導(dǎo)出功能,讓我前端實(shí)現(xiàn),所以在這里記錄下前端導(dǎo)出功能,需要的朋友可以參考下
2023-08-08
javascript使用activex控件的代碼
最近公司項(xiàng)目用到了avtivex控件。以前從來沒有用過。我把最近到處找到的使用方法整理一下。
2011-01-01
微信小程序時(shí)間標(biāo)簽和時(shí)間范圍的聯(lián)動(dòng)效果
這篇文章主要為大家詳細(xì)介紹了微信小程序時(shí)間標(biāo)簽和時(shí)間范圍的聯(lián)動(dòng)效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2019-02-02
js實(shí)現(xiàn)QQ面板拖拽效果（慕課網(wǎng)DOM事件探秘）（全）
這篇文章主要為大家詳細(xì)介紹了QQ面板拖拽效果，探秘慕課網(wǎng)DOM事件，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-09-09
這篇文章主要介紹了JS實(shí)現(xiàn)兼容性好,自動(dòng)置頂?shù)奶詫殤腋」ぞ邫谛Ч?涉及JavaScript動(dòng)態(tài)判斷頁面元素位置及樣式設(shè)置技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-09-09