推荐阅读

网站分类

文章归档

设置表格的 HTML 代码是什么格式？

码农 by：码农 分类：前端开发 时间：2025/04/14 阅读：25 评论：0
在 HTML 中，设置表格的代码有特定的格式。表格由 标签定义，表格的行由 标签定义，单元格由
标签定义。以下是一个简单的示例：

基本表格结构

示例代码： 

<table>
  <tr>
    <td>单元格 1</td>
    <td>单元格 2</td>
  </tr>
  <tr>
    <td>单元格 3</td>
    <td>单元格 4</td>
  </tr>
</table>
上述代码创建了一个简单的 2 行 2 列的表格，每个单元格中包含了一些文本。

添加表头

示例代码： 

<table>
  <tr>
    <th>表头 1</th>
    <th>表头 2</th>
  </tr>
  <tr>
    <td>单元格 3</td>
    <td>单元格 4</td>
  </tr>
</table>
通过在表格的行中使用 		标签，可以创建表头。表头通常用于显示表格的列标题。

合并单元格

示例代码： 

<table>
  <tr>
    <td colspan="2">合并单元格 1</td>
  </tr>
  <tr>
    <td>单元格 2</td>
    <td>单元格 3</td>
  </tr>
</table>
使用 		标签的 colspan 属性可以合并单元格。在上述代码中，第一个单元格跨越了 2 列。

设置表格样式

示例代码： 

<style>
  table {
    border-collapse: collapse;
    width: 100%;
  }
  th, td {
    border: 1px solid black;
    padding: 8px;
  }
  </style>
  <table>
  <tr>
    <th>表头 1</th>
    <th>表头 2</th>
  </tr>
  <tr>
    <td>单元格 3</td>
    <td>单元格 4</td>
  </tr>
</table>
通过在