增加td的宽度，使内容在一行上

Question

我有一个看起来像这样的表：

+----------------------+-------------------+
| This text is on the  | This text is on   |
| first column         | the second column |
+----------------------+-------------------+

我希望它看起来像这样：

+----------------------------------+-----------------------------------+
| This text is on the first column | This text is on the second column |
+----------------------------------+-----------------------------------+

我的表比屏幕长，并且有很多行，但这是我想要的功能。 是否有CSS属性可以在不截断文本的情况下实现？ 如果没有，有人可以指向我如何做到这一点的JavaScript示例？

Answer 1

试试white-space ：

td { white-space: nowrap; }

Answer 2

如果您需要比white-space: nowrap更广泛的浏览器支持white-space: nowrap您可以使用预标签。 css解决方案更好，但如果你真的必须使用pre ：

<tr>
  <td><pre>This is my non wrapping text</pre></td>
  <td><pre>Some more non wrapping text</pre></td>
</tr>

显然，这只适用于表格单元格中的简单html，加上pre通常带有它自己的默认样式，你可以在CSS中使用以下内容：

td pre {
  font-family: inherit;
  font-size: inherit;
  /* ... and so on */
}

使用inherit可能会稍微少一点，所以如果可以的话，最好直接定义你想要的样式。

Answer 3

尝试：

<table>
  <tr>
    <td nowrap>Look ma</td>
  </tr>
</table>