HTML5表格的使用
单元格的背景颜色,对齐方式
表格图片及小表格的嵌入
<!DOCTYPE html>
<html lang="en">
<head>
<title>表格<table></title>
</head>
<body background=".//11.jpg">
<h1>
<p style="text-align: center">
<span style="background-color: aqua" > 表 格 </span>
</p>
</h1>
<h3>
<span style="background-color: aqua"><caption>定义表格主题<br></span>
<span style="background-color: aqua"><thead>定义表头<br></span>
<span style="background-color: aqua"><th>定义表头单元格<br></span>
<span style="background-color: aqua"><tbody>定义表格主题<br></span>
<span style="background-color: aqua"><tr>定义表格行<br></span>
<span style="background-color: aqua"><td>定义表格主体(每一个)单元格<br></span>
<span style="background-color: aqua"><tfloot>定义表格脚注<br></span>
</h3>
<table border="1" cellpadding="16" cellspacing="8">
<caption style="background-color: aqua">单元格间距cellpadding和边距cellspacing</caption>
<thead>
<tr>
<td>表头A</td>
<td>表头B</td>
<td>表头C</td>
<td>表头D</td>
</tr>
</thead>
<tbody>
<tr>
<td>boder="1"表示显示表格边框,默认为0不显示</td>
<td></td>
<td>不填写内容则表示为空</td>
<td>不添加cell padding则根据单元格内容自动调节</td>
</tr>
</tbody>
</table>
<br>
<table border="1" cellpadding="25" cellspacing="0" style="font:bolder">
<caption style="background-color: aqua">rowspan跨行colspan跨列</caption>
<thead>
<tr>
<td>表头A</td>
<td>表头B</td>
<td></td>
<td>表头D</td>
</tr>
</thead>
<tbody>
<tr>
<td>row 1,col 1</td>
<td></td>
<td rowspan="2">跨两行</td>
<td rowspan="3">
<table border="1" cellpadding="6" cellspacing="4">
<caption style="background-color: aqua">单元格颜色和对齐方式</caption>
<thead cellpadding="10">
<th align="left">表头A</th>
<th align="center">表头B</th>
<th align="right">表头C</th>
</thead>
<tbody>
<tr>
<td bgcolor="azure">单元格的背景颜色</td>
<td bgcolor="azure"></td>
<td bgcolor="azure"><font color="red">单元格字体颜色</font></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td colspan="2">跨两列</td>
</tr>
<tr>
<td>嵌入图片</td>
<td colspan="2"><img src="C://Users//DELL//Pictures//Saved Pictures//12.jpg"
width=220 height=180 alt="error">
</td>
</tr>
</tbody>
</table>
</body>
</html>
建议使用谷歌浏览器哦
实现效果