电子邮件 HTML 表格 - HTML

简介

在电子邮件中添加 HTML 表格可以使邮件更具可读性，提高信息呈现的效率。HTML 表格可以用于展示数据、图片、文字和链接等内容。HTML 表格支持的样式和功能非常丰富，如设置表格的宽度、高度、边框、背景色、字体样式等。本文将介绍如何在电子邮件中添加 HTML 表格，并且列出常用的 HTML 表格样式。

代码示例

<table border="1">
  <tr>
    <th>编号</th>
    <th>姓名</th>
    <th>年龄</th>
    <th>性别</th>
    <th>电话</th>
  </tr>
  <tr>
    <td>1</td>
    <td>小明</td>
    <td>18</td>
    <td>男</td>
    <td>13888888888</td>
  </tr>
  <tr>
    <td>2</td>
    <td>小红</td>
    <td>20</td>
    <td>女</td>
    <td>13999999999</td>
  </tr>
  <tr>
    <td>3</td>
    <td>小刚</td>
    <td>22</td>
    <td>男</td>
    <td>13666666666</td>
  </tr>
</table>

上面的代码片段展示了一个基本的 HTML 表格，包含表头和三行数据。<table> 表示表格的开头，</table> 表示表格的结尾。<tr> 表示一行数据，</tr> 表示一行数据的结尾。 <th> 表示表头，<td> 表示单元格。表格的边框样式可以用 border 属性来设置。

常用的 HTML 表格样式

设置表格边框

使用 border 属性设置表格边框的样式。

<table border="1">

设置单元格的背景色

使用 bgcolor 属性设置单元格的背景色。

<td bgcolor="#FFFF00">单元格</td>

合并单元格

使用 rowspan 属性可以将多个行单元格合并为一行单元格。

<td rowspan="2">合并的单元格</td>

使用 colspan 属性可以将多个列单元格合并为一列单元格。

<td colspan="2">合并的单元格</td>

设置表格样式

使用 style 属性可以设置更加丰富的表格样式，包括字体、边框、背景色等。

<table style="border: 1px solid black;font-family: Arial, sans-serif;background-color: #F8F8F8;width: 100%;">

总结

本文介绍了如何在电子邮件中添加 HTML 表格，并列出了常用的 HTML 表格样式和属性。使用 HTML 表格可以使电子邮件更加美观、清晰和直观，提高信息呈现的效率。