html在表格里如何自动换行

来源：佚名编辑：佚名

2024-03-30 04:30:42

在HTML中，可以使用<br>标签或者CSS样式来实现表格内的自动换行，以下是一个简单的示例：

<!DOCTYPE html>
<html>
<head>
<style>
table {
  width: 100%;
  bordercollapse: collapse;
}
table, th, td {
  border: 1px solid black;
}
th, td {
  padding: 15px;
  textalign: left;
}
.wrap {
  whitespace: normal;
  wordwrap: breakword;
}
</style>
</head>
<body>
<h2>小标题1</h2>
<table>
  <tr>
    <th>标题1</th>
    <th>标题2</th>
  </tr>
  <tr>
    <td class="wrap">这是一个很长的文本，需要在表格单元格内自动换行，使用<br>标签或者CSS样式实现。</td>
    <td class="wrap">这是另一个很长的文本，需要在表格单元格内自动换行，使用<br>标签或者CSS样式实现。</td>
  </tr>
</table>
</body>
</html>

在这个示例中，我们使用了<style>标签来定义CSS样式。.wrap类设置了whitespace: normal;和wordwrap: breakword;属性，使得文本在表格单元格内自动换行，我们在需要换行的文本中使用了<br>标签或者添加了.wrap类。