HTML 合并单元格
具体实例:用HTML实现下列表格
知识点一
HTML表格标签:<table></table> 表头标签:<th></th> 行标签:<tr></tr> 列标签:<td></td>
制表思路:先不管合并,先把表格完整的几行几列neng出来,在找到需要合并的格,合并,并删除合并后多余的行或列。
知识点二
给表格加边框 :样式属性
table{ //表格属性
width:80%;
border:black 1px solid;
border-spacing: 0px;
border-collapse: collapse;
border-color: black;
}
th{
height: 50px;
border:black 1px solid;
border-spacing: 0px;
border-collapse: collapse;
border-color: black;
text-align: center;
vertical-align:auto;
}
td,tr{
text-align: center;
vertical-align: middle;
height: 50px;
border:black 1px solid;
border-spacing: 0px;
border-collapse: collapse;
border-color: black;
}
运行结果图
知识点三
把上图中相同的表头合并:
样式属性:
合并行:rowspan="数字(即需要合并的行数)"; 合并列:colspan="数字(即需要合并的列数)";
运行结果图`
<td rowspan="2">序号</td> //“序号”合并两行,合并后应把第二行删除
<td colspan="3">个人信息</td> //合并三列,合并后,把下面两列都删除
<td colspan="3"> 第一学期</td>
<td colspan="3"> 第二学期</td>
最后用同样的合并方法加上第一行的大标题(其实是我上面把第一行忘记了o(╯□╰)o)
以下是个人总结哦!!!!!
背景知识:浏览器是什么?
浏览器是一中软件,用来执行网页代码(包括HTML,CSS,JavaScript脚本等),并将执行结果显示出来。HTML所用的编译器是HBuild,一般使用谷歌浏览器执行代码。此外,浏览器在打开某个网页后可以查看该网页的源代码。
什么是HTML语言?
HTML(Hyper Text Markup Language)是超文本标记语言。