0

我想将 TD 宽度设置为字符数，例如，如果我设置为 11，则只能显示 11 个字符，其余字符必须在新行中。我尝试了 width 属性，但它在不同的浏览器/分辨率中显示不同。

<table border="1">
    <tr>
<td>test1</td>
<td>CRTAX_G</td>
    <td>
    28-FEB-2013, 11-MAR-2013, 13-MAR-2013
    </td>
    </tr>
<tr>
<td>test1</td>
<td>CRTAX_G</td>
    <td>
    28-FEB-2013, 11-MAR-2013, 13-MAR-2013
    </td>
    </tr>
<tr>
<td>test1</td>
<td>CRTAX_G</td>
    <td>
    28-FEB-2013, 04-MAR-2013, 05-MAR-2013, 07-MAR-2013, 11-MAR-2013, 13-MAR-2013, 12-MAR-2013, 08-MAR-2013, 06-MAR-2013
    </td>
    </tr>
<tr>
<td>test1</td>
<td>CRTAX_G</td>
    <td>
    28-FEB-2013, 11-MAR-2013, 13-MAR-2013
    </td>
    </tr>
<tr>
<td>test1</td>
<td>CRTAX_G</td>
    <td>
    28-FEB-2013, 06-MAR-2013, 08-MAR-2013, 12-MAR-2013, 13-MAR-2013, 11-MAR-2013, 07-MAR-2013, 05-MAR-2013, 01-MAR-2013
    </td>
    </tr>
    <table>

它将表格中的日期在一行中显示为，

28-FEB-2013, 06-MAR-2013, 08-MAR-2013, 12-MAR-2013,

我希望它显示为

   28-FEB-2013,
   11-MAR-2013,
   13-MAR-2013,

每个日期都必须换行。

4

5 回答 5

3

我能想象的最简单的解决方案是：

table tr td+td+td {
  font-size: 100%;
  font-family: monospace;
  width: 8em;
}

http://jsbin.com/elaleg/1/edit

于 2013-03-14T08:31:41.603 回答
1

您可以使用以下样式将文本包装在标签或其他任何内容中：

display: inline-block; width: 11em;

检查JsFiddle

于 2013-03-14T08:27:36.923 回答
0 
<html>
 <body>
   <table border="1">
    <tr>
        <td style="width:103px;word-wrap:break-word;">28-FEB-2013, 11-MAR-2013, 13-MAR-2013</td>
    </tr>
</table>
 </body>
</html>

试试这个，我希望你能得到解决方案

于 2013-03-14T08:27:19.577 回答
0

你可以检查这个

或有效地尝试 css 样式的空白

white-space: nowrap;
于 2013-03-14T08:27:44.143 回答
0

这是一种对我有用的解决方案。假设 td 有一个指定的类名（比如 payerName），并且表有一个 id（比如 sortable）。

$(".payerName").css({"white-space":"nowrap"});
$(".payerName").css({"overflow":"hidden"});
$(".payerName").css({"text-overflow":"ellipsis"});
$("#sortable").css("table-layout","fixed");

这是一组可用于避免长字符串进入 td 的步骤。ellipsis 属性将在字符串/值的末尾添加一个“...”。您可以添加 title 属性，以便在鼠标悬停时显示实际值。

希望这可以帮助！

于 2016-08-04T11:23:09.440 回答