当前位置:首页 > 行业动态 > 正文

html在表格里如何自动换行

在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类。

0