《教案HTML之CSS滤镜及练习层Div块及Span标记举例窗口内例题演示功能的实现总结.docx》由会员分享，可在线阅读，更多相关《教案HTML之CSS滤镜及练习层Div块及Span标记举例窗口内例题演示功能的实现总结.docx（6页珍藏版）》请在三一文库上搜索。
1、名师精编 优秀教案章节题目CSS滤镜及练习、层 Div块及Span标记举例、窗口 内例题演示功能的实现总结课型讲授教学目的学习HTML语言重点语言格式及应用难点做为语言，体系的理解参考书目HTME用课件教具教学后记教学过程备注内容及安排：1. 层（教学web开发技术 我的JSP站点 例题层行为），继续讲完；2. CSS（滤镜）（ 教学web开发技术 例题alpha滤镜，同学们 参考教材自己练习 blur和wave滤镜！）；3. HTML1I础之一 .PPT, p6491 ; Dreamweaver行为演小及代码解析（ 教学web开发技术例题定义div块并进行平滑移动）；（ 教学web开发技术
2、例题 span标记举例）；（ 教学web开发技术例题利用form计算阶乘）；（机动）4 .囱口内例题演小功能的实现总结。（结合iframe、例题span标记举例、层！）5 .留10分钟，共同总结应该掌握及考试的内容！练习：1 . CSS滤镜（blur、wave）;2 .结合“span标记举例”和“例题层行为”及“ iframe例题”，实现 课件演示！3 .将“定义div块并进行平滑移动”中向左移动完成。说明：内容较多，大约时间是 2次课完成！A、B、C 分 别为要求学 生掌握、理 解、了解可以适当用Dreamweaver 制作，并讨 论、演示同一 例题3.4 HTML的图像与多媒体标记在网页中
3、加入图像和多媒体信息可以使网页更加生动活泼。3.4.1 图像标记再简单朴素的网页如果只有文字而没有图像将失去许多活力，图像在网页制作中是非常重要的元素， HTML言提供了 IMG=#记来处理图像的输出。功能：在当前位置插入图像。格式：。属性：src :设置要加入图像文件的URLM址，通常图像格式为gif或jpg。alt :设置图像文件的替代说明，当图像无法显示时，显示“简单说明” 。“alt属性在浏览器装载图像失败的时候告诉用户所丢失的信息，此时，浏览器显示这个交互文本”来代替图像。给页面上的图像都加上alt属性是一个好习惯，它有助于更好地显示信息，而且，对纯文本浏览器很有用。longdesc
4、 :设置图像的详细说明。width :设置图像的宽度，可以为点数或相对窗口宽度的百分比。height ：设置图像的高度，可以为点数或相对窗口高度的百分比。border ：设置图像外围边框宽度，其值为正整数。hspace ：设置水平方向空白（图像左右留多少空白）。horizontal ,h?riz?nt?l n.水平线，水平面，水平位置a.水平线的，平坦的，横的n.水平 计水平 vspace :设置垂直方向空白（图像上下留多少空白）。verticalW?:tik?la.垂直的，竖的，纵向的align :设置在页面中的位置，可以为LEFT, RIGHT或CENTER说明：图像的宽度和高度指图像显示
5、时的大小，与图像的真实大小无关。IMG拆记并不是真正地把图像加入到HTML文档中，而是2标记对的src属性赋值，这个值是图像文件的文件名，当然包括路径，这个路径可以是相对路径，也可以是网址。实际上就是通过路径将图像文件嵌入到HTML文档中。设置图像文件地址时用到的路径一般建议使用相对路径，所谓相对路径是指所要链接或嵌入到当前HTML文档的文件与当前文件的相对位置所形成的路径。假如HTML文件与图像文件（文件名假设是logo.gif） 在同一个目录下，则可以将代码写成IMG src= logo.gif ” ;假如图像文件放在当前的HTML文档所在目录的一个子目录（子目录名假设是images）下，
6、则代码应为IMG src= images/logo.gif ” ;假如图像文件放在 当前的HTM仪档所在目录的上层目录（目录名假设是home）下，则相对路径就必须是准网址了，即用“./ ”表示网站，然后在后边紧跟文件在网站中的路径，假设home是网站下的一个目录，则代码应为IMGsrc= ./home/logo.gif ” ,若 home是网站下的目录king 下的一个子目录，则代码应该变为IMGsrc= ./king/home/logo.gif ” 了。例3-12 图像标记的应用。 仞j 3-12的代码 例3-12的演示效果3.4.2 背景音乐标记功能：在网页中加入声音，声音文件格式可以为*
7、.wav、*.au或*.mid 。格式：BGSOUND src=声音文件的URL地址 loop= 播放次数” 。属性：“sr峨示 源”的意思。src指明声音文件的 URL地址。loop控制播放次数，取-1或INFINITE 时，声音将一直播放到浏览者离开该网页为止。3.4.3 视频标记功能：在网页中加入视频信息，格式一般为*.AVI。格式：IMG src= image-URL dynsrc= avi-URL “ loop= n start=开始时间controlsloopdelay=时间间隔”。属性：scr :设置一幅静态图像的URL地址，在未载入.AVI文件时，先在.AVI的播放区域显示该图
8、像。dynsrc :设置视频文件存放的路径和文件名。100P :设置视频文件播放的次数，如果其值为INFINITE则表示反复播放直到浏览者离开该网页。start : 设置何时开始播放视频文件，它有两个属性值fileopen 和mouseover。fileopen 是指在链接到含本标记的页面时开始播放，mouseover是指将鼠标移动到.AVI播放区时开始播放，默认值为fileopen 。另外，当鼠标在 AVI播放区单击时，也可使浏览器开始播放。controls :在视频窗口下附加 MS-WINDOWS AVI文件播放控制条。loopdelay :设置两次播放的间隔时间，单位是毫秒。此外，还有I
9、MG的常见属性，如 width , height , align等也可以使用。3.5 HTML的超链接标记超链接是网页制作中最关键的内容，超链接把页面一个个链接起来，使得网页的浏览非常方便。超链 接标记如下：功能：建立超链接。格式：A href= URL target= window_name” 显示的文本或图像 /A。属性：href :设置要链接到的目标的URL地址。target :指出要显示超链接内容的窗口名，默认时指在当前窗口中显示。window-name：显示超链接内容的窗口名，如果该窗口不存在，则表示打开一个新窗口。例3-13】 超链接标记的应用。例3-13 例3-13的演示效果 实践与练习：仿例题 3-13 ,制作一个学习总结。