跨行跨列表格、表格分组标签的使用.docVIP

内蒙古科技大学信息工程学院计算机系 《网页设计与制作》实验报告 姓名 张燕斌 学号 1267159206 实验成绩 班级 软件12级 2 班 实验日期 第 14 周（星期一 ） 12 月 1 日第 56 节 项目号、实验名称 实验4 跨行跨列表格、表格分组标签的使用 实 验 要 求 （任课 教 师 提 供） 实验目标： 掌握表格的基本语法 掌握表格的跨行属性rowspan、跨列属性colspan 掌握表格的分组标签thead、tbody、tfoot的配合用法 实验所需软件： Ultra Edit 实验内容： 练习——跨行跨列表格 需求说明：实现一个跨行跨列的商品类目表格，如图1.1所示。 图1.1 跨行跨列的商品分类表格 练习——表格分组标签的使用 需求说明：实现一个按地点和时间汇总的年终报表，如图1.2所示。 图1.2 数据分组的表格 实 验 内 容 （由学 生 填 写） 1练习——跨行跨列表格 html head title跨行跨列表格/title /head body table width=300border=1 tr td colspan=3height=65h1商品类目/h1/td /tr tr td rowspan=3虚拟/td td移动/td td联通/td /tr tr td充值卡/td td彩票/td /tr tr td梦幻/td tdQQ/td /tr tr td rowspan=3护肤/td td美容护肤/td td美体/td /tr tr td彩妆/td td香水/td /tr tr td个人护理/td td保健/td /tr /table /body /html 2练习——表格分组标签的使用 html head title表格分组标签的使用/title /head body table width=100% caption年中数据报表/caption thead style=background:#0FF tr th /th th一月/th th二月/th th三月/th th小计(RMB)/th /tr /thead tbody style=background:#9CC tr td北京/td td10/td td10/td td50/td td70/td /tr tr td上海/td td20/td td30/td td70/td td120/td /tr tr td天津/td td30/td td40/td td80/td td150/td /tr /tbody tfoot style=background:#FF0 tr td总计/td td60/td td80/td td200/td td240/td /tr /tfoot /table /body /html 评 语 （由教 师 填 写） 说明： 1、每个实验项目填写一份实验报告，电子版命名方式为：学号姓名项目号.doc。例如：1167111182张三3.doc表示张三做的第3个项目的实验报告。 2、实验报告电子版应该在实验后一周内由学习委员收齐后存放在一个文件夹下，文件夹命名方式为：软件12-1班3，表示软件12-1班第3个项目的实验报告，压缩。第一时间发送给任课教师。必须以班级为单位上交。 3、任课教师要求在收到实验报告的一周内进行批阅，并给出成绩及评语。 4、实验报告电子版由任课教师保存。 5、表格宽度可以根据实际情况伸缩。 5