浙教版信息技术八年级上第十四课建立分页面教学设计
课题
建立分页面
单元
第三单元
学科
信息技术
年级
八年级
学习
目标
知识目标：会制作分栏目的页面；学会新建各式网页并命名。
技能目标：掌握制作网页的几种技巧充实页面的内容；
情感目标：体验创作的乐趣，培养学生的想象能力。
重点
建立网站分页面，灵活运用表格与单元格的设置技巧
难点
建立网站分页面，灵活运用表格与单元格的设置技巧
教学过程
教学环节
教师活动
学生活动
设计意图
导入新课
上面第一幅图片是网站主页，点击分栏目后出现与分栏目相关的页面。我们主页建好了，也需要建立与栏目相关的分页面。那么，如何建立分页面呢？我们就开始学习吧！
思考
激发学生学习兴趣并快速进入学习状态
讲授新课
一个完整的网站不仅有精美的主页面，还需要更丰富的分栏目页面。
一、建立分栏目网页
新建分栏目网页的方法与新建主页类似。
1.单击菜单栏中的“文件”→“新建网页”，选择“HTML”(如图)
2.单击“确定”按钮后，生成网页文件“无标题_1.hum”(如图)，可根据各分栏目名称将网页文件另存为合适的文件名。
“网络世界”根据网站栏目的设计目为“网络拾贝”、“网络交流”、“网络安全”及“网络生活”等
建立的相应网页文件为wlsb.htm、 wlil. htm、wlaq.htm及wlsh.hm，文件夹列表如图所示。
二、充实分栏目网页内容
与主页制作方法类似，分栏目网页一般也使用表格对版面布局，然后按栏目策划方案加人内容。
制作时可参考如下页面制作技巧
1.调整表格指定宽度
通常采用改变表格宽度“百分比”来控制表格在页面中的比例。
(1)右击表格，选择“表格属性”
(2)在“表格属性”对话框中，勾选“指定宽度(H)”复选框，选择“百分比”
在文本框中输人具体的数值，如输入“100”表示表格的宽度与网页的宽度一样
输入“50”则表示表格只占网页可视区域的一半，如图所示。
2.改变表格线外观
插入表格的默认“边框”粗细为“0”，预览时，看不见表格线
如要让表格线在预览时显示，则要将“边框”的粗细值设为具体的数值，如“1”
表格线“边框”粗细为“0”，虽然看不见表格线，但单元格之间仍有比较大的间距，会让人感觉线条的存在。
只要合理地设置“单元格衬距”和“单元格间距”的参数，就能生成细线条的表格
浏览时看不到表格线，也感觉不到线条的存在，如图所示
日积月累
单元格间距指两个相邻单元格之间的距离;单元格衬距指单元格内容与单元格左边距和上边距之间的距离
亲身体验
对单元格的“边框粗细”、“单元格衬距”等参数作不同的设置，观察网页表格线外观的变化情况。
阅读材料
使用CSS样式表
在制作网页的过程中，往往要求整个网站的文本、表格的样式协调统一
若手工设置每个页面的文本、表格等格式，将会非常麻烦
使用CSS样式可以解决这问题，并能提高网页制作的工作效率
级联样式表是由国际组织所制定的一套延伸HTML样式的新标准
用来控制网页内容的外观格式，包括版面的精确位置、特定的字体和格式，甚至图像、表格和图层等的位置和格式
可以应用多个样式表到同一个网页中。
使用CSS样式表需要先创建字体新样式，然后再应用。
一、创建字体新样式
1.打开新的空白网页，在文件区中输入文字。
2.在“格式”菜单中选择“新建样式”(如图)，弹出“新建样式”对话框
3.在“选择器”中输入样式名称，如“标题字”
在“定义位置”列表中，选择“当前网页”:设置“类别”列表中各个参数的属性，如文字的字体、大小、粗细、拉长、变窄、颜色等，如图所示。
4.单击“确定”按钮，完成CSS样式设置。
二、应用字体新样式
1.在菜单栏中选择“格式”→“CSS样式”A新建式(选项“应用样式”，打开“应用样式”任务窗格，如图所示。
2.选中要设置为“标题字”样式的文字，在 “应用样式”任务窗格中，选择“标题字”样式，改动所选文字的样式。
要清除文字中已应用的样式，可选中该文字，在“应用样式”任务窗格中，右击“标题字”样式，单击“清除样式”命令即可。
课堂练习
1.根据设计的分栏目版块制作分栏目网页。
2.在因特网上学习有关制作网站的技巧，使分栏目页面更加精美。
通过教师的讲解，以小组合作的方式，开展探讨交流，完成任务。
通过教师的讲解，以小组合作的方式，开展探讨交流，完成任务。
学生动手实践操作，学生小组间讨论，共同完成任务。
通过教师的讲解，以小组合作的方式，开展探讨交流，完成任务。
学生小组间讨论，共同完成任务，并分组汇报。
通过小组合作，加强学生组内团结、共同完成任务，
培养学生组间合作能力，并且炼动手能力
培养学生动手操作能力，并且锻炼学生的语言组织能力和表达的能力。
培养学生组间合作能力，并且炼动手能力
培养学生独立完成练习的能力。
课堂小结
分小组总结归纳，教师补充。
各组汇报总结，其他小组成员做补充。
锻炼学生的总结能力，逻辑思维、语言表达能力。
布置作业
1.根据设计的分栏目版块制作分栏目网页。
2.在因特网上学习有关制作网站的技巧，使分栏目页面更加精美。
板书
一、建立分栏目网页
二、充实分栏目网页内容
1.调整表格指定宽度
2.改变表格线外观
课件23张PPT。信息技术浙教版 八年级上第十四课 建立分页面新知导入 上面第一幅图片是网站主页，点击分栏目后出现与分栏目相关的页面。我们主页建好了，也需要建立与栏目相关的分页面。那么，如何建立分页面呢？我们就开始学习吧！新知讲解 新知讲解一、建立分栏目网页新建分栏目网页的方法与新建主页类似。 1.单击菜单栏中的“文件”→“新建网页”，选择“HTML”(如图)2.单击“确定”按钮后，生成网页文件“无标题_1.hum”(如图)，可根据各分栏目名称将网页文件另存为合适的文件名。新知讲解“网络世界”根据网站栏目的设计目为“网络拾贝”、“网络交流”、“网络安全”及“网络生活”等建立的相应网页文件为wlsb.htm、 wlil. htm、wlaq.htm及wlsh.hm，文件夹列表如图所示。“网络世界”根据网站栏目的设计目为“网络拾贝”、“网络交流”、“网络安全”及“网络生活”等建立的相应网页文件为wlsb.htm、 wlil. htm、wlaq.htm及wlsh.hm，文件夹列表如图所示。“网络世界”根据网站栏目的设计目为“网络拾贝”、“网络交流”、“网络安全”及“网络生活”等建立的相应网页文件为wlsb.htm、 wlil. htm、wlaq.htm及wlsh.hm，文件夹列表如图所示。新知讲解二、充实分栏目网页内容 与主页制作方法类似，分栏目网页一般也使用表格对版面布局，然后按栏目策划方案加人内容。制作时可参考如下页面制作技巧1.调整表格指定宽度 通常采用改变表格宽度“百分比”来控制表格在页面中的比例。新知讲解 (1)右击表格，选择“表格属性” (2)在“表格属性”对话框中，勾选“指定宽度(H)”复选框，选择“百分比”在文本框中输人具体的数值，如输入“100”表示表格的宽度与网页的宽度一样输入“50”则表示表格只占网页可视区域的一半，如图所示。新知讲解插入表格的默认“边框”粗细为“0”，预览时，看不见表格线如要让表格线在预览时显示，则要将“边框”的粗细值设为具体的数值，如“1”2.改变表格线外观 表格线“边框”粗细为“0”，虽然看不见表格线，但单元格之间仍有比较大的间距，会让人感觉线条的存在。新知讲解只要合理地设置“单元格衬距”和“单元格间距”的参数，就能生成细线条的表格新知讲解日积月累新知讲解亲身体验新知讲解阅读材料在制作网页的过程中，往往要求整个网站的文本、表格的样式协调统一若手工设置每个页面的文本、表格等格式，将会非常麻烦使用CSS样式可以解决这问题，并能提高网页制作的工作效率若手工设置每个页面的文本、表格等格式，将会非常麻烦使用CSS样式可以解决这问题，并能提高网页制作的工作效率新知讲解 用来控制网页内容的外观格式，包括版面的精确位置、特定的字体和格式，甚至图像、表格和图层等的位置和格式可以应用多个样式表到同一个网页中。 级联样式表是由国际组织所制定的一套延伸HTML样式的新标准使用CSS样式表需要先创建字体新样式，然后再应用。新知讲解 1.打开新的空白网页，在文件区中输入文字。一、创建字体新样式 2.在“格式”菜单中选择“新建样式”(如图)，弹出“新建样式”对话框新知讲解3.在“选择器”中输入样式名称，如“标题字”在“定义位置”列表中，选择“当前网页”:设置“类别”列表中各个参数的属性，如文字的字体、大小、粗细、拉长、变窄、颜色等，如图所示。4.单击“确定”按钮，完成CSS样式设置。新知讲解1.在菜单栏中选择“格式”→“CSS样式”A新建式(选项“应用样式”，打开“应用样式”任务窗格，如图所示。二、应用字体新样式2.选中要设置为“标题字”样式的文字，在 “应用样式”任务窗格中，选择“标题字”样式，改动所选文字的样式。新知讲解课堂练习 1.根据设计的分栏目版块制作分栏目网页。
2.在因特网上学习有关制作网站的技巧，使分栏目页面更加精美。课堂小结总结本节课所学内容板书设计一、建立分栏目网页
二、充实分栏目网页内容
1.调整表格指定宽度
2.改变表格线外观1.根据设计的分栏目版块制作分栏目网页。
2.在因特网上学习有关制作网站的技巧，使分栏目页面更加精美。作业布置谢谢21世纪教育网（www.21cnjy.com) 中小学教育资源网站 有大把高质量资料？一线教师？一线教研员？
欢迎加入21世纪教育网教师合作团队！！月薪过万不是梦！！
详情请看：
https://www.21cnjy.com/help/help_extract.php
