教案之滤镜及练习层块及标记举例窗口内例题演示功能的实现总结 .docx
精品名师归纳总结可编辑资料 - - - 欢迎下载精品名师归纳总结章节题目CSS 滤镜及练习、层 Div 块及 Span 标记举例、窗口内例题演示功能的实现总结教学目的学习 HTML语言重点语言格式及应用难点做为语言,体系的懂得课型讲授可编辑资料 - - - 欢迎下载精品名师归纳总结参考书目HTML专用课件教具教学后记可编辑资料 - - - 欢迎下载精品名师归纳总结内容及支配 :教 学过程备注A 、B、C 分可编辑资料 - - - 欢迎下载精品名师归纳总结1. 层(教学web 开发技术 我的 JSP 站点例题层行为),连续讲完。2. CSS(滤镜)(教学web 开发技术 例题alpha滤镜,同学们参考教材自己练习blur和 wave 滤镜!)。3. HTML基础之一 .PPT,p6491 。Dreamweaver 行为演示及代码解析(教学 web 开发技术 例题 定义 div 块并进行平滑移动)。(教学 web 开发技术 例题 span标记举例)。(教学 web 开发技术 例题 利用 form 运算阶乘)。(机动)4. 窗口内例题演示功能的实现总结。(结合 iframe 、例题 span 标记举例、层!)5. 留 10 分钟,共同总结应当把握及考试的内容!练习:1. CSS 滤镜( blur、 wave)。2. 结合“ span 标记举例”和“例题层行为”及“iframe 例题”,实现课件演示!3. 将“定义 div 块并进行平滑移动”中向左移动完成。说明:内容较多,大约时间是2 次课完成!别 为 要 求 同学 掌 握 、 懂得、明白可 以 适 当 用Dreamweaver 制 作 , 并 争论、演示同一例题可编辑资料 - - - 欢迎下载精品名师归纳总结3.4 HTML 的图像与多媒体标记在网页中加入图像和多媒体信息可以使网页更加生动活泼。3.4.1 图像标记再简洁朴实的网页假如只有文字而没有图像将失去很多活力,图像在网页制作中是特别重要的元素,HTML语言供应了 <IMG>标记来处理图像的输出。功能:在当前位置插入图像。格式:<IMGsrc=“image-URL” alt= “简洁说明” longdesc= “具体说明” width= “x” height= “ y”border=“边框长度” hspace= “ x” vspace= “ y” align=“对齐方式” >。属性:src :设置要加入图像文件的URL的址,通常图像格式为gif或 jpg 。alt :设置图像文件的替代说明,当图像无法显示时,显示“简洁说明”。“alt属”性在浏览器装载图像失败的时候告知用户所丢失的信息,此时, 浏览器显示这个 “交互文本 ”来代替图像。给页面上的图像都加上alt 属性是一个好习惯,它有助于更好的显示信息,而且,对纯文本浏览器很有用。longdesc :设置图像的具体说明。width :设置图像的宽度,可以为点数或相对窗口宽度的百分比。height :设置图像的高度,可以为点数或相对窗口高度的百分比。border :设置图像外围边框宽度,其值为正整数。hspace :设置水平方向空白(图像左右留多少空白)。horizontal ,h. ri'z .nt.l n.水平线 , 水平面 , 水平位置a.水平线的 , 平整的 , 横的可编辑资料 - - - 欢迎下载精品名师归纳总结n.水平 计水平vspace :设置垂直方向空白(图像上下留多少空白)。vertical .v.:tik . la. 垂直的,竖的,纵向的align :设置在页面中的位置,可以为LEFT, RIGHT或 CENTE。R说明:图像的宽度和高度指图像显示时的大小,与图像的真实大小无关。<IMG>标记并不是真正的把图像加入到 HTML文档中,而是给标记对的src属性赋值,这个值是图像文件的文件名,当然包括路径,这个路径可以是相对路径,也可以是网址。实际上就是通过路径将图像文件嵌入到HTML文档中。设置图像文件的址时用到的路径一般建议使用相对路径,所谓相对路径是指所要链接或嵌入到当前HTML文档的文件与当前文件的相对位置所形成的路径。假如HTML文件与图像文件 文件名假设是 logo.gif在同一个目录下,就可以将代码写成 <IMG src= “logo.gif”>。假如图像文件放在当前的HTML文档所在目录的一个子目录 子目录名假设是images 下,就代码应为 <IMG src= “images/logo.gif”>。假如图像文件放在当前的 HTML文档所在目录的上层目录 目录名假设是 home下,就相对路径就必需是准网址了,即用“ ./” 表示网站,然后在后边紧跟文件在网站中的路径,假设home 是网站下的一个目录,就代码应为<IMG src= “./home/logo.gif”>,如home 是网站下的目录king下的一个子目录,就代码应当变为<IMG src= “./king/home/logo.gif”>了。【例 3-12 】 图像标记的应用。例 3-12 的代码例 3-12 的演示成效3.4.2 背景音乐标记功能:在网页中加入声音,声音文件格式可以为*.wav 、*.au或*.mid 。格式: <BGSOUND src=“声音文件的URL的址” loop= “播放次数” >。属性: “src表”示 “源”的意思。 src 指明声音文件的 URL 的址。 loop掌握播放次数, 取 -1或 INFINITE时,声音将始终播放到浏览者离开该网页为止。3.4.3 视频标记功能:在网页中加入视频信息,格式一般为*.AVI 。格式: <IMG src= “ image-URL” dynsrc=“ avi-URL ” loop=“ n” start=“开头时间”controls loopdelay=“时间间隔” >。属性:scr :设置一幅静态图像的URL的址,在未载入 .AVI 文件时,先在 .AVI 的播放区域显示该图像。可编辑资料 - - - 欢迎下载精品名师归纳总结dynsrc :设置视频文件存放的路径和文件名。loop :设置视频文件播放的次数,假如其值为INFINITE 就表示反复播放直到浏览者离开该网页。start: 设置何时开头播放视频文件,它有两个属性值fileopen和 mouseover 。 fileopen是指在链接到含本标记的页面时开头播放,mouseover是指将鼠标移动到.AVI播放区时开头播放,默认值为fileopen。另外,当鼠标在AVI 播放区单击时,也可使浏览器开头播放。controls:在视频窗口下附加MS WINDOW的S AVI 文件播放掌握条。loopdelay:设置两次播放的间隔时间,单位是毫秒。此外,仍有 IMG的常见属性,如 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 ,制作一个学习总结。可编辑资料 - - - 欢迎下载