0

我正在使用一个 web 模板，它在 CSS 文件中定义了以下内容：-

div.dataTables_length select {
width: 50px;
}
.dataTables_filter input, .dataTables_length select {
display: inline-block;
margin-bottom: 0;
}

该表定义如下：-

<div class="box-content">
<table class="table table-striped table-bordered bootstrap-datatable datatable">
<thead>
<tr>
<th></th> <th></th>
</tr></thead>
<tbody> 
<tr>

Btu 目前我面临的一个问题是模板会自动截断值并仅显示其中的一部分。因此，例如，如果有一个长描述值，则单元格可能会显示其中的一部分。那么有没有办法修改表格，使其具有以下内容： -

  1. 表格单元格将始终具有相同的宽度，但具有动态高度。
  2. 表格应始终具有相同的宽度，因此在长文本的情况下不会超出布局。
  3. 要显示每个字段的全文，并且单元格应自动移动到新行。

问候

：：：编辑：：：

如果表格列包含长测试，这就是表格的显示方式：-

在此处输入图像描述

4

1 回答 1

1

截断问题已在评论中得到解决。我将解决表格的宽度。

如果要设置表格列的宽度，您需要为所有列设置相同的宽度或为某些列指定特定宽度。

.table th, .table td { width: 50px; } /* sets the default value of all columns */
.table .name { width: 100px; word-wrap: break-word; } /* overrides the default with specific value for certain column*/

<table class="table">
  <tr>
    <td class="name">James T. Kirk</td>
    <td class="name">Spock</td>
  </tr>
</table>

我会回避在列宽上使用百分比 (%)，尤其是在文本长度波动的情况下。

编辑 - 我明白你的意思。你需要把一个 css 样式的 word-wrap: break-word; 我更新了上面的代码并做了一个jsfiddle演示。

于 2013-07-09T16:58:18.317 回答