【问题标题】:three dots - overflow:ellipsis三个点 - 溢出:省略号
【发布时间】:2012-06-20 07:52:34
【问题描述】:

我的问题是,为什么“文本溢出:省略号;”不适合我吗? 我的页面上有表格,我想缩短单元格(td)内的一些文本。 如您所见,我在 css 中没有宽度参数。我从 json 得到这个值,然后用 jquery 设置它。也许这就是问题所在?如果是这样,我该如何解决?

#myTable2 td{
    white-space: nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    min-width:47px;
    border-top: solid 1px #ebebeb;
    border-spacing:none;
    cellpadding: 0;
    cellspacing: 0;
    font-family:arial;
    font-size: 8pt;
    color: #3D3D3D;
    padding: 4px;
}

我在 Chrome 19、最新的 Firefox 和 IE9 中测试它。 谢谢

【问题讨论】:

  • 当您不想对其设置宽度限制时,您希望它如何缩短文本?
  • 是的 lanzz 这是我的问题...正如我所说,我从 json 文件设置宽度...我得到宽度参数,然后我使用 jaascriopt 设置它...宽度取决于用户...
  • 对不起,误会你了。我以为你在设置文本,而不是宽度。

标签: javascript jquery css


【解决方案1】:

你需要一个表格的宽度和table-layout:fixed;

http://jsfiddle.net/CagPK/

#myTable2 td{
    white-space: nowrap;
    overflow: hidden;
    text-overflow:ellipsis;
}
#myTable2 
{
    table-layout:fixed;
    width: 100px;
}
​

【讨论】:

  • 好的,我会尝试使用固定布局...正如我所说,我使用 javascript 设置宽度...也许这是问题所在? :>
  • 好的!谢谢它的工作......我在我的脚本中发现了错误并修复它......现在它工作得很好:>再次
【解决方案2】:

text-overflowdisplay: block 元素一起使用,而表格单元格是 display: table-cell 元素。将您的文本包含在 <div> should work 中(当您单击文本时,小提琴会设置宽度)。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2018-07-22
    • 1970-01-01
    • 1970-01-01
    • 2013-04-01
    • 2017-01-21
    • 2019-04-29
    • 2019-03-06
    • 1970-01-01
    相关资源
    最近更新 更多