HTML表格
table:表格区域
tr标签：表格中的行
th标签:表格的表头
td标签：表格单元格
在开发工具HbuilderX中可以用table>tr* 行数 >td * 列数 可快速生成一个表格。
在每个标签内赋予属性，可达到一定的效果；
1.table:表格区域
border边框
width 宽
height 高
bgcolor 背景颜色
background 背景
cellpadding: 内容到边框的距离,
cellspacing: 单元格与单元格之间的距离,一般设置为"0";
align="center": 控制表格在本行中的水平位置。
caption 加入表格的标题。
cols 是 列数
rows 是 行数
2. tr:表格行
height 高
bgcolor 背景颜色
background 背景
align="center" 让本行所有单元格内容居中
valign 设置内容的垂直位置 。 有三个值 top （紧贴边框上部）； middle（居中）； bottom（紧贴边框底部）。
3.td单元格
width 宽
bgcolor背景颜色
background 背景
align="center"
valign 设置内容的垂直位置 top middle bottom
th:表头,也是单元格,内容加粗居中显示
colspan: 跨列
rowspan:跨行
练习
完成图片所给效果：
代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<table border="1"align="center"width="800"cellspacing="0">
<caption>财务报表</caption>
<tr align="center"valign="top">
<td colspan="2">品 牌</td>
<td colspan="3">春 装</td>
<td colspan="3">夏 装</td>
</tr>
<tr align="center"valign="top">
<td colspan="2"></td>
<td>男 装</td>
<td>女 装</td>
<td>童 装</td>
<td>男 装</td>
<td>女 装</td>
<td>童 装</td>
</tr>
<tr align="center"valign="top">
<td rowspan="2">JC</td>
<td>牛仔系列</td>
<td>110</td>
<td>50</td>
<td>228</td>
<td>586</td>
<td>255</td>
<td>98</td>
</tr>
<tr align="center"valign="top">
<td>休闲系列</td>
<td>120</td>
<td>500</td>
<td>400</td>
<td>198</td>
<td>88</td>
<td>50</td>
</tr>
</table>
</body>
</html>
效果：
标签：表格,标签,单元格,tr,边框,HTML,nbsp 来源： https://www.cnblogs.com/MrTumnus-xiaozhiRE0-lizhiqing/p/15037576.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。