我试图在Table标签中实现String省略号.
源代码如下.
<div> <div class="widget-body no-padding" style="min-height:0px;"> <table class="table" style="table-layout: fixed;"> <tbody> <c:forEach var="item" items="${result.stuffList}" varStatus="idx"> <c:if test="${idx.index < 5}"> <tr> <td class='text-center' style="width: 80%; text-overflow:ellipsis; -o-text-overow: ellipsis; word-wrap:normal; overflow: hidden;"> <nobr> <a href="#" onclick="javascript:location.href='/view?nid=${item.id}'">${item.name}</a> </nobr> </td> <td class='text-center' style="width: 20%;"> ${item.regDate} </td> </tr> </c:if> </c:forEach> </tbody> </table> </div> </div>
但是,当我测试响应时变得丑陋.
我写了以下部分来表达项目注册日期.
但是当浏览器缩小时,它的后面部分没有显示在屏幕上.
<td class='text-center' style="width: 20%;"> ${item.regDate} </td>
所有浏览器中如何在Bootstrap中使用省略号?
所以看起来像这样
我期望的(缩小浏览器时)>>
第1栏/第2栏
AAAA …. / 2014-09-24
现在看起来像>>
第1栏/第2栏
AAAA …. / 2014-09
问题是>>
我的猜测>>
也许桌布:固定;风格是事业.但是不知道如何在没有表格布局的情况下实现String省略号功能.
我希望比我先要问的更清楚:D
我有事业
问题是width:80%,width:20%,table-layout:fixed.
所以当我调整浏览器的大小时,它需要这些选项.
但是我仍然不知道如何更换它.
所有这些都是一个div,这是网站的一小部分,我想要响应网络.
编辑后选择答案.
感谢您回答我的问题!
但是我发现原因,但无法解决这个问题.
选择的答案是不相关的,但它是有帮助的.
我的问题不是通过引导,而是宽度.
即使使用响应式Web库,
如果您使用带%或px属性的宽度,则无法响应.
解决方法
您必须将此所有样式应用于省略号元素.
{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }