HTML如何防止表格单元格中的文本换行

有谁知道如何防止表格单元格中的文本换行？这是针对表的标题，标题比它下面的数据长得多，但我只需要它显示在一行上。如果列很宽也可以。

我的（简化）表的 HTML 如下所示：

<table>
  <thead>
    <tr>
      <th>
        <div>Really long column heading</div>
      </th>
      <th>
        <div>Really long column heading</div>
      </th>
      <th>
        <div>Really long column heading</div>
      </th>
      <th>
        <div>Really long column heading</div>
      </th>
      <th>
        <div>Really long column heading</div>
      </th>
      <th>
        <div>Really long column heading</div>
      </th>
      <th>
        <div>Really long column heading</div>
      </th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>
        <div>data</div>
      </td>
      <td>
        <div>data</div>
      </td>
      <td>
        <div>data</div>
      </td>
      <td>
        <div>data</div>
      </td>
      <td>
        <div>data</div>
      </td>
      <td>
        <div>data</div>
      </td>
      <td>
        <div>data</div>
      </td>
    </tr>
  </tbody>
</table>

标题本身被包装在标签内的 div 中，原因与页面上的 javascript 有关。th

表格出来时，标题换行到多行。这似乎只发生在表格足够宽的情况下，因为浏览器试图避免水平滚动。不过，就我而言，我想要水平滚动。

有什么想法吗？

分割线

网友回答：

看看属性，像这样使用：white-space

th {
    white-space: nowrap;
}

这将强制的内容显示在一行上。<th>

在链接页面中，以下是以下各种选项：white-space

normal
此值指示用户代理折叠空格序列，并根据需要中断行以填充行框。

pre
此值可防止用户代理折叠空格序列。行仅在保留的换行符处断开。

nowrap
此值像“正常”一样折叠空格，但禁止显示文本中的换行符。

预包装
此值可防止用户代理折叠空格序列。在保留的换行符处换行，并根据需要填充行框。

pre-line
此值指示用户代理折叠空格序列。在保留的换行符处换行，并根据需要填充行框。

分割线

网友回答：

<th nowrap="nowrap">

或

<th style="white-space:nowrap;">

或

<th class="nowrap">
<style type="text/css">
.nowrap { white-space: nowrap; }
</style>

分割线

网友回答：

至少有两种方法可以做到这一点：

在“td”标签中使用 nowrap 属性：

<th nowrap="nowrap">Really long column heading</th>

在单词之间使用不可断开的空格：

<th>Really&nbsp;long&nbsp;column&nbsp;heading</th>

模板简介：该模板名称为【HTML如何防止表格单元格中的文本换行】，大小是暂无信息，文档格式为.编程语言，推荐使用Sublime/Dreamweaver/HBuilder打开，作品中的图片，文字等数据均可修改，图片请在作品中选中图片替换即可，文字修改直接点击文字修改即可，您也可以新增或修改作品中的内容，该模板来自用户分享，如有侵权行为请联系网站客服处理。欢迎来懒人模板【HTML】栏目查找您需要的精美模板。