免费的h5制作网站 h5表单制作教程( 三 )


6、为了让课表更美观,我们将“上午/下午”和节次合并,将“社团活动”合并 。我们通过设置<td>元素的colspan属性,实现这个目标 。修改后的HTML文档如下:
<!DOCTYPE html><html><head><title>table005</title><meta charset="utf-8" /></head><body><table border="1"><caption>华南师大附中初二(12)班课程表</caption><tr><th colspan="2">节次</th><th>周一</th><th>周二</th><th>周三</th><th>周四</th><th>周五</th></tr><tr><td rowspan="4">上午</td><td>第1节课</td><td>语文</td><td>语文</td><td>英语</td><td>英语</td><td>语文</td></tr><tr><td>第2节课</td><td>语文</td><td>数学</td><td>数学</td><td>英语</td><td>数学</td></tr><tr><td>第3节课</td><td>英语</td><td>数学</td><td>物理</td><td>化学</td><td>物理</td></tr><tr><td>第4节课</td><td>英语</td><td>政治</td><td>地理</td><td>物理</td><td>政治</td></tr><tr><td rowspan="3">下午</td><td>第5节课</td><td>数学</td><td>生物</td><td>信息</td><td>数学</td><td>化学</td></tr><tr><td>第6节课</td><td>体育</td><td>化学</td><td>语文</td><td>语文</td><td>美术</td></tr><tr><td>第7节课</td><td colspan="5">社团活动</td></tr></table></body></html>使用浏览器打开该文件,效果如下:
7、现在表格内容基本上完整了,就是显得有点小 。修改一下HTML文档,添加一下列宽的信息,修改后的HTML文档如下:
<!DOCTYPE html><html><head><title>table006</title><meta charset="utf-8" /></head><body><table border="1" style="width:800px;text-align:center"><caption>华南师大附中初二(12)班课程表</caption><tr><th colspan="2">节次</th><th>周一</th><th>周二</th><th>周三</th><th>周四</th><th>周五</th></tr><tr><td rowspan="4">上午</td><td>第1节课</td><td>语文</td><td>语文</td><td>英语</td><td>英语</td><td>语文</td></tr><tr><td>第2节课</td><td>语文</td><td>数学</td><td>数学</td><td>英语</td><td>数学</td></tr><tr><td>第3节课</td><td>英语</td><td>数学</td><td>物理</td><td>化学</td><td>物理</td></tr><tr><td>第4节课</td><td>英语</td><td>政治</td><td>地理</td><td>物理</td><td>政治</td></tr><tr><td rowspan="3">下午</td><td>第5节课</td><td>数学</td><td>生物</td><td>信息</td><td>数学</td><td>化学</td></tr><tr><td>第6节课</td><td>体育</td><td>化学</td><td>语文</td><td>语文</td><td>美术</td></tr><tr><td>第7节课</td><td colspan="5">社团活动</td></tr></table></body></html>使用浏览器打开这个文件,效果如下:
其实,在HTML5中,除了上面五个主要元素,还有三个较常用的的元素:


以上关于本文的内容,仅作参考!温馨提示:如遇健康、疾病相关的问题,请您及时就医或请专业人士给予相关指导!

「四川龙网」www.sichuanlong.com小编还为您精选了以下内容,希望对您有所帮助: