1 / 41
文档名称:

网页设计与制作教案.docx

格式:docx   大小:508KB   页数:41页
下载后只包含 1 个 DOCX 格式的文档,没有任何的图纸或源代码,查看文件列表

如果您已付费下载过本站文档,您可以点这里二次下载

文档介绍:盛年不重来,一日难再晨。及时宜自勉,岁月不待人。
[章节名称]:网页设计入门基础
[课堂类型]:理论■ 实训口 练习■ 测试口
[学时安排]:2课时
[目的要求]
了解网络的基本知识,网页设计的基础知识,网页的分类,动态网页的原理进行教学讲解,结合疑难点师生互动交流方式进行。
.练习采用学生自主安排,教师给与个别辅导的方式进行。
[参考资料]
« Dreamweaver CS5—页设计与制作—— DIV+CSSfi》吴丰,丁欣 主编 清华大学出版社
《动态网页制作教程》(第二版)刘梅彦徐英慧编著清华大学出版社
[教学过程]
环节一:复习HTML®言中设置背景颜色,背景图片,音乐等标签的知识,介绍HTML 语言的编写规范要求。
环节二:讲解html语言的跑马灯效果标记,序列卷标标记的使用
.跑马灯效果
该标记能实现文字或图片的滚动效果。
<MARQUEE direction="up" width="100" height="100"
bgcolor="#ccffcc" scrollamount="2">滚动文字 </MARQUEE>
主要参数:
① direction:控制移动方向,可取"left", "right", "up", "down"四个

②behavior:移动方式,可取"scroll"(循环移动),"slide"(只走一圈),
"alternate"(来回移动)
③loop:循环次数,不输入表示无限次循环
④scrollamount: 移动快慢,数值越大越快
⑤scrolldelay:每移动一步之后的延时,单位是毫秒
⑥height,width:移动区域的高和宽,单位像素
⑦bgcolor:移动区域的背景色
.序列卷标
该类型标记类似于 Word软件中的项目符号及编号,主要分为两种
(1)无序标记
无序序列就是序列各条目间无顺序关系
<UL>
<LI>姓名:吴小娟</LI>
<LI>生日:1993/6/16</LI>
<LI>星座:双子座</LI>
</UL>
运行的效果如下:
姓名:吴小娟
生日:1993/6/16
星座:双子座
其中<UL也无序序列标记,每增加一个条目,就要添加一个<LI>
还可以通过设置<ULtype="属性” >来改变条目前面的图标,属性可以是Disk (实 心圆),Square (方形),Circle(空心圆)
(2)有序标记
无序序列就是序列各条目间有顺序关系
<OL>
<LI>姓名:吴弘凯
<LI>生日:1993/6/16
<LI>星座:双子座
</OL>
运行的效果如下:
.姓名:吴小娟
.生日:1993/6/16
.星座:双子座
其中<OL功无序序列标记,每增加一个条目,就要添加一个 <LI>
还可以通过设置<OL type="属性” >来改变条目前面的编号,属性可以设置为1
(数字)、A (大写英文字母)、a (小写英文字母)、I (大写罗马字母)、i (小写 罗马字母)等五种。
环节三:完成课堂讲解的练习例题,并疑难解答
环节四:复习本次课内容,步骤课后作业。
[章节名称]:html基础及应用3
[课堂类型]:理论■ 实训口 练习■ 测试口
[学时安排]:2课时
[目的要求]
了解Html语言的控制表格及其表项,框架
[重 点]
Html语言的表格及其表项的标记使用,超链接标记,框架标记的使用
[难 点]
掌握利用框架标记来设计页面
[教法学法]
.采用教授法进行教学讲解,结合疑难点师生互动交流方式进行。
.练习采用学生自主安排,教师给与个别辅导的方式进行。
[参考资料]
« Dreamweaver CS5—页设计与制作—— DIV+CSSfi》吴丰,丁欣 主编 清华大学出版社
《动态网页制作教程》(第二版)刘梅彦徐英慧编著清华大学出版社 [教学过程]
环节一:复习HTMLlht中跑马灯效果标记,序列卷标的使用方法。
环节二:讲解html语言的表格标记,超链接标记,框架标记的使用
.表格标记
<table>...</table> -定义表格
tr> ...</tr>-定义表行
th> ...</th>-定义表头
td> ...</td>-定义表元
.超链接标记
超链接采用<a> - </a>标记来实现,链接文件的路径有以下两种:
<a href="/c|/www/text1.htm">绝对路径方式
<a href="text1.htm">相对路径方式
.框架结构标记
<HTML>
<HEAD>
<TITLE>框窗实作 </TITLE>
</HEAD>
<FRAMESET COLS="120,*” >

分享好友

预览全文

网页设计与制作教案.docx

上传人:fangjinyan2017001 2022/5/18 文件大小:508 KB

下载得到文件列表

网页设计与制作教案.docx

相关文档