3 Web多媒体项目开发.pptVIP

第3章 基于Web的多媒体项目开发 河南大学计算机与信息工程学院 赵建辉 jhzhao@ 本章主要内容 超文本标记语言HTML 使用FrontPage开发多媒体网页 虚拟现实造型语言VRML 使用可视化工具开发三维多媒体网页 无线标记语言 3.1 超文本标记语言HTML HTML概述 HTML文件基本结构 超链接标记 多媒体标记 表单标记 HTML文件的保存 3.1.1 HTML概述 网页编著有HTML代码编写和使用“所见即所得”网页编著工具两种方法。 超文本标记语言(HyperText Markup Language, HTML)是一种用来创作Web页面的描述语言。 HTML网页文件通过标记(Tag)，将影像、声音、图像、文字等链接显示出来。 3.1.1 HTML概述 HTML标记由“”、“标记名称”和“”三部分组成，如H1 HTML标记可以嵌套，标记名称中的字母不分大小写，标记还可以包含“属性”，用于提供相应的附加信息，如颜色、字体、对齐方式等等。 HTML 文件以.htm 或.html为扩展名保存后，由浏览器打开显示。 3.1.2 HTML文件基本结构 每个HTML文档都是由标记html 开始，以标记/html 结束 整个HTML文件分成两个部分组成：文档头（head）和正文（body）。 3.1.2 HTML文件基本结构 基本结构 HTML HEAD TITLE.../TITLE /HEAD BODY 正文内容 /BODY /HTML 3.1.3 超链接标记 链接是指将文档中的文本或者图像与另一个文档、文档的一部分或者另一幅图像链接在一起 超链接标记是a，其基本格式是： a href=URL ... /a 3.1.3 超链接标记 URL(Uniform Resource Locator)是识别因特网上任何一个文件地址或资源地址的标准表示法，称为统一资源地址 URL地址中采用相对路径链接比使用绝对路径链接的运行效率更高 绝对路径：请求服务的类型、网络上的主机名、服务器上的文件名 相对路径：文件名 【例3-1】超链接的实现。 3.1.4 多媒体标记 在网页中嵌入的多媒体元素包括文本、图像、声音和视频。 内联图像 内联图像指与Web网页中的文本一起下载和显示的图像，表现为文本和图像显示在同一网页上。 格式： img src=ImageName … /img 3.1.4 多媒体标记 外联图像 如果内联图像文件太大，可以用文字或者小的内联图像来代表大图像 然后把它们与大图像文件链接在一起，当用鼠标单击这个链接后，大图像显示在另一个窗口中，这种图像就称为外联图像 格式：a href=“ImageName”…/a 【例3-2】内联图像与外联图像 3.1.4 多媒体标记 图像作为网页的背景 格式：body background=ImageName 在文档中链接声音或视频文件 使用与外联图像类似的语句 差别是文件扩展名不同 【例3-3】链接声音文件或视频文件 3.1.4 多媒体标记 在文档中嵌入声音或视频文件： embed src=声音或视频文件名…/embed 【例3-4】嵌入声音文件 在文档中嵌入背景声音 bgsound src=URL loop=100 3.1.5 表单标记 表单是信息交流的窗口 用户填写表单，单击“提交” 按钮提交表单 表单处理程序从表单中收集信息，将数据提交给服务器 服务器启动表单控制器进行数据处理，并将结果生成新的网页，显示在用户屏幕上。 3.1.5 表单标记 标准格式： form action=”URL” method=* input type=… …… /form 用户单击提交按钮后，可以通过ASP实现与服务器端的交互功能。 【例】表单 3.1.6 HTML文件的保存 习惯上将一个网站的首页文件保存为index.htm 或index.html 考虑到许多服务器不支持中文文件名，文件在命名时应尽量采取有意义的英文名称。 对于有大量文件的网站，为了便于文件的管理，需要规划文件的目录结构。 目录结构的好坏对浏览者来说没有什么太大的影响，但是对于站点本身的上传维护、站点内容未来的扩充和移植有着重要的影响。 3.1.6 HTML文件的保存 规划目录结构常遵循的几个原则 不要将所有文件都存放在根目录下 按站点内容栏目分别建立子目录 在每个子目录下建立image子目录，专门存放相应栏目中的图像等文件 不要使用过长的目录、不要使用中文目录、尽量使用意义明确的目录。 3.2 FrontPage开发多媒体网页 FrontPage2003简介 在FrronttPagee2003中创建网站 在FrronttPagee2003中创建网页 使用框架进行网页布局 使用表格进行