Dreamweaver MX网页设计与制作01.ppt

1.9.2 上机操作 绘制表格，并且在第一个单元格内插入一个Flash按钮。 在其右侧插入Flash文本。 插入Flash游戏文件 制作好的Flash游戏网页 1.10 插入音频和视频 网页中插入的主要音频格式 Midi或Mid ，Musical Instrument Digital interface 直译为“乐器数字接口”，为大多数浏览器支持，且不需要插件。声音品质很好，且文件较小。但是Mid文件不可以被录制，且必须使用特殊的硬件和软件在计算机上合成。 Wav 较高的声音质量，能够为大多数浏览器支持，且不需要插件。但文件较大。 Aif或aiff 较高质量，和wav相近。 1.10.1 基本概念 第1章 第1章 走进 Dreamweaver ● 网页基本概念 ● 认识Dreamweaver ● 网页的构成元素 ● 网页的设计与规划 本章学习知识点 上一张 下一张 返回 1.1 第一个主页：基本操作 本章内容目录 1.2 学生成绩表：表格的应用 1.3 学生成绩分类汇总:表格综合应用 1.4 图片应用：网上花店 1.5 小说封面：图像映射 1.6 层的使用：使用层编排网页 1.7 框架技术：星座介绍 1.8 插入Java Applet：焰火晚会 1. 9 插入Flash：在线游戏 本章内容目录 1.10 插入视频和声音 1.11 本章小结 1.12 本章习题 1.1 基本操作 1.1.1 网页的基本概念 网页：通常是HTML格式（文件扩展名为.html或.htm）。网页通常用图像来提供图画，网页要透过网页浏览器来阅读。 HTML语言：HTML的全称是Hyper Text Markup Language，中文翻译为“超文本标记语言”。它的特点是用语言来设计网页，但是其实质和通过Dreamweaver可视化软件设计页面是一致的。 示例： 北京航空航天大学图书馆主页 HTML代码 结合可视化设计 html head …… …… /head body …… …… …… /body /html 超文本 标记 “容器” 页头“容器” 这对标签之间是该超文本文档文档头。对该超文本文档的定义、说明、描述等都在这部份。 主体部份“容器” 这对标签之间是该超文本文档的具体内容。该网页要传送的信息基本上都在这一部份。 1.1.2 第一个网页的制作－－Hello World! 1. 启动Dreamweaver 2. 新建网页文档 3. 在编辑窗口中输入文字 4. 按〔F12〕键观察效果 1.2 学生成绩表 1.2.1 表格的基本概念 1.2.2 插入表格的三种方法 表格是网页中最重要的工具之一。 作为一个基本的网页构成应该以表格为基础，搭配其他的辅助排版工具，使页面达到最佳的设计效果。 1.2.3 表格的属性设置 1.2.4 制作学生成绩表 通过设置〔输入表格〕对话框来制作一个表格 在表格内的各个单元格内，插入文本，并且选择居中对齐 1.3 学生成绩分类汇总 1.3.1 基本概念和操作 增加行和列 单击一个单元格，执行菜单 修改-〉表格-〉插入行，则在光标所在行的上面插入新的一行。 同样，执行 修改-〉表格-〉插入列，则在光标左侧插入新的一列 增加多行或者列 执行 修改-〉表格-〉插入行或列 在弹出对话框中设置 无论文本、图像、动画等，一切在网页中可以插入的对象，在表格或者单元格中都可以插入。 插入方法基本相同，将光标置于表格或者单元格中，就可以执行相应的操作 所插入的对象，同样可以在属性面板中进行编辑 表格的嵌套 可插入对象的类型 Dreamwaver8 内置了多种基于颜色搭配的表格样式，可以从中选择合适的样式来使用。 执行菜单 命令-〉格式化表格 制作格式化表格 1.3.2 制作成绩列表 首先插入一个7行6列的表格 将第一行的单元格合并 设置表格的颜色 第一行设置颜色为黄色，RGB值为##FFFF00 第一行一下设置颜色为绿色，RGB值为##CCFF00 插入表格内容 删除行高和列宽 1.4 网上花店 图像是网页设计中不可或缺的重要组成部分。但作为网页设计人员应该考虑到网页的大小，从而照顾到各种用户的需求。下面这个例子就来介绍如何对网页图像进行处理，使得在保持图形美丽与网站风格搭配的基础之上，力求图片能够变得更小。 ● 设置图像大小 ● 设置图像超链接 ● 设置图像对齐方式　 ● 设置图像替换 ● 低分辨率载入 1.4.1 基本概念 新建表格，并将光标置于某一个单元格内。 在属性面板中，单击[浏览文件]按钮，弹出选择文件对话框。 选择插入图片。 当插入的图片不在站点根目录或者其子目录中，则软件会提示是否需要复制一份拷贝文件到相应的根文件夹中。 1.