网页设计教案资料.doc

新 乡 技 师 学 院 教 案 2012-2013学年度第二学期 课程名称： 网页设计 授课班级： 11级电子商务班 授课教师： 朱 小 燕 教 学 部： 电子信息系 2013年3月1日 审 批 表 日 期课题（章节）内容教案质量教研室主任意见签 字授课班级授课日期授课题目：第一章 简单网页制作（一） 目的要求：掌握新建站点及网页的方法；掌握网页的属性设置、水平线的插入、滚动字幕的插入及图象的插入等网页的简单美化操作；。 重点难点：网页的属性设置、水平线的插入、滚动字幕的插入及图象的插入等网页的简单美化操作 组织教学：点名考勤；复习；引入新课；讲解理论知识；实例演示；指导学生练习；总结 总结复习导入新课：信息技术突飞猛进，不断地创造着令人耳目一新的天地。就在人们对互联网络有所认识的时候，电子商务这一全新的事物又以难以估量的速度兴起，并进而改变着社会经济生活的各个方面。电子商务正从一个概念慢慢变成我们生活中不可缺少的一部份，作为一个现代公民，认识、了解、学习电子商务是非常必要的,而网页制作是专业的电子商务人员所不可缺少的一项技能，从本次课开始我们将详细的学习网页的简单制作方法。 提问： 1、曾经是否学习过网页的制作方法？ 2、对网页有什么看法？ 教学方式、手段、媒介：教学手段：讲授、多媒体；媒介：教材 授课内容： 一、创建新站点和网页 （一）、创建新站点 1、启动FrontPage2003应用程序，单击主界面“常用”工具栏上“新建普通网页”按钮右侧的下拉箭头，在弹出的下拉菜单中选择“站点（w）…”，在打开的“Web站点模板”对话框中，选择“空白站点”模板类型，如图所示。指定新站点的的位置为d：\dzsw，表示新建立网站的所有文件夹和文件都存放在本地机D盘的dzsw目录中。 2、单击“确定”按钮。此时即完成了网站的建立。 （二）、创建网页 1、在FrontPage2003的“网页”视图下，单击“常用”工具栏上的“新建普通网页”按钮右侧的下拉箭头，在弹出的下拉菜单中单击其中的“网页（P）”命令，打开如图所示的网页模板对话框。根据需要选择合适或接近的模板新建网页，如选择“普通网页”。 2、单击“确定”按钮，此时，在工作区上方显示该网页为“new_page_1.htm”。 3、保存网页并更改网页标题 （1）单击“文件（F）”菜单中的“保存（S）”命令，打开“另存为”对话框。如图所示 （2）在对话框中的“文件名（N）”处，输入文件名（通常为index）,保存类型为“Web页”。 （3）单击对话框中的“更改标题（C）…”按钮，打开“设置网页标题”对话框。 （4）在对话框中输入网页标题，单击F“确定”按钮。 （5）单击“保存（S）”按钮，保存网页。 二、网页美化操作 （一）、网页属性的设置 1、选择“文件”菜单下“属性”命令或单击鼠标右键，选择“网页属性”命令，打开“网页属性”对话框。 2、在“网页属性”对话框中分别进行设置。在“常规”选项卡中设置背景音乐及循环次数；在“背景”选项卡中设置背景的图片或背景的颜色以及超链接不同状态的显示效果；在“语言”选项卡中设置语言的类型等。 （二）、在网页中插入水平线 1、将光标移到需插入水平线的位置。 2、单击“插入”菜单中的“水平线”命令。 3、选中水平线并双击，打开如所示的“水平线属性”对话框进行设置。 （三）、网页中插入剪贴画库中的水平线 1、将光标移到需插入水平线的位置。 2、单击“插入”菜单下的“图片”子菜单中的“剪贴画”命令，打开“插入剪贴画”任务窗格。 3、在任务窗格的“搜索文字”文本框中输入“水平线”，单击“搜索”按钮，任务窗格中出现搜索出的水平线图样。如图所示 4、单击要选择的水平线图样即可插入水平线。 （四）、插入图像 1、单击“插入”菜单中的“图片”子菜单中的“来自文件”命令。 2、在“图片”对话框中，选择一个需要的图像文件，单击“插入”按钮，图像出出在网页相应的位置。 3、选中图片，单击鼠标右键，从弹出的快捷菜单中选择“图片属性”命令，打开“图片属性”对话框，选定其中的“外观”选项卡，在其中进行环绕样式、布局、大小等设置。 4、也可以使用“图片”工具栏上的按钮给图片加上文字、创建缩略图、旋转、对比度及亮度等设置。 （五）、插入滚动字幕 1、选择“插入”菜单中的“W