4

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

+----------------------+-------------------+
| 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 示例吗？

4

3 回答 3

3

试试这个white-space属性：

td { white-space: nowrap; }
于 2012-10-05T07:30:31.723 回答
1

如果您需要比white-space: nowrap使用 pre 标签更广泛的浏览器支持。虽然 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的支持可能会稍微少一些，所以如果可以的话，最好直接定义你想要的样式。

于 2012-10-05T07:38:36.173 回答
0

尝试：

<table>
  <tr>
    <td nowrap>Look ma</td>
  </tr>
</table>
于 2012-10-05T10:46:51.457 回答