HTML表格th内容过长自动换行

在网页设计中，我们经常使用表格来展示数据。但当表格的表头内容过长时，会导致单元格被撑开，破坏页面布局。为了解决这个问题，我们可以使用CSS属性'word-wrap: break-word;'。

word-wrap: break-word; 属性允许浏览器在单词内部进行换行，以便将长单词放置在单元格内，而不会超出其边界。

示例：

<table>
  <tr>
    <th style='word-wrap: break-word;'>这是一个非常长的表头内容，它超过了单元格的宽度，因此会自动换行。</th>
    <th>其他表头</th>
  </tr>
  <tr>
    <td>数据1</td>
    <td>其他数据</td>
  </tr>
  <tr>
    <td>数据2</td>
    <td>其他数据</td>
  </tr>
</table>

在上面的示例中，我们将'word-wrap: break-word;'样式应用于第一个表头单元格。这将使表头内容在需要时自动换行，而不会超出单元格的宽度。

总结：

使用'word-wrap: break-word;'属性可以轻松解决HTML表格中表头内容过长的问题，使表格布局更加美观。