教学项目十二HTML中表格的制作 教学内容】 讲解HTML中制作表格的标志 教学目的】 使学生掌握简单表格的制作 教学重点】 表格中单元格的合并操作 【教学难点 理解属性 rowspan与 col span的含义 教学方式】 案例分析式、项目教学 【教学参考 << JavaScript入门与提高〉〉杨浩著 清华大学出版社 2.<< Internet网页工场> Wittime工作室重庆出版社 3.<< Javascript从入门到精通 电脑报社出版 4.HML网页制作教程材义语编著铁道出版社 、HIML基础与实例程耀编著电子工业出版社
教学项目十二 HTML中表格的制作 【教学内容】 讲解HTML中制作表格的标志 【教学目的】 使学生掌握简单表格的制作 【教学重点】 表格中单元格的合并操作 【教学难点】 理解属性rowspan与colspan的含义 【教学方式】 案例分析式、项目教学 【教学参考】 1．<<JavaScript 入门与提高>> 杨浩著 清华大学出版社 2．<<Internet 网页工场>> Wittime工作室 重庆出版社 3．<<JavaScript从入门到精通>> 电脑报社出版 4．HTML网页制作教程 材义语编著 铁道出版社 5、HTML基础与实例 程耀编著 电子工业出版社
【新课】 表格基本标志 1)<table/table> (2)<tr></tr> (3)<td></td (4)<th></th> < table)</ table>用来创建一个表格框架 tr〉</tr>创建表格的一行 <td〉</td>创建表格一行中的一个单元格 它们的对应关系如下 <tabley <tr) <td>第一行第一列</td <td>第一行第二列</td <td>第一行第三列</td <td>第一行第四列</td </tr> </table> <th>/th> 用于定义表格头
【新课】 一、表格基本标志 (1)<table></table> (2) <tr></tr> (3) <td></td> (4)<th></th> <table></table>用来创建一个表格框架 <tr></tr>创建表格的一行 <td></td>创建表格一行中的一个单元格 它们的对应关系如下: <table> <tr> <td>第一行第一列</td> <td>第一行第二列</td> <td>第一行第三列</td> <td>第一行第四列</td> </tr> </table> <th></th> 用于定义表格头
例1在网页中制作表格 含表格制作-重 icrosoft Internet Exp1ore 巴回区 文件)辑吧)查看C收藏)工具〔)帮助0 ⊙后·国常收买的媒体的,· 地址①)G: FrontPage\111.htm 转到链接” 表格例子 完毕 3我的电脑 开力3顺90,1一顺「表格制作一M 15:25
例1 在网页中制作表格:
<> <Head> title>表格制作</ title /head> Cbody bgcolor=0Oeeff> < center>表格例子 Ktable border=l width=300 align=center) <tr> <td> /td> <td> /td> <tdF</td> </tr) <tr> <td>F/td> <td>F/td> <td> /td〉 </tr> <tr> <td> /td> <td>F/td> <td>F(/td> </table) </body> /h
<HTML> <Head> <title>表格制作</title> </head> <body bgcolor=00eeff> <center>表格例子 <table border=1 width=300 align=center> <tr> <td> </td> <td> </td> <td>F</td> </tr> <tr> <td>F</td> <td>F</td> <td> </td> </tr> <tr> <td> </td> <td>F</td> <td>F</td> </tr> </table> </body> </html>
、< table)</ table>标志中配合使用的属性 1. border 设置表格边框的宽度 2. bgcolor 设置表格背景颜色 3. background 设置表格背景图片 4. width 设置表格宽度 5. height 设置表格高度 6. cellspacing 设置表格内框线宽度 7. cellpadding 设置表格内文字与表格边框线的间 距 8. align 设置表格水平对齐方式 9. valign 设置表格垂直对齐方式 10. bordercolor 设置表格边框颜色 11. bordercolorlight设置表格明亮边框颜色 12. bordercolordark设置表格暗边框颜色
二、<table></table>标志中配合使用的属性 1. border 设置表格边框的宽度 2. bgcolor 设置表格背景颜色 3. background 设置表格背景图片 4. width 设置表格宽度 5. height 设置表格高度 6. cellspacing 设置表格内框线宽度 7. cellpadding 设置表格内文字与表格边框线的间 距 8. align 设置表格水平对齐方式 9. valign 设置表格垂直对齐方式 10.bordercolor 设置表格边框颜色 11.bordercolorlight 设置表格明亮边框颜色 12.bordercolordark 设置表格暗边框颜色