02_网页设计基础6.2.3--6.3.ppt

第6章 网页设计基础Dreamweaver CS4 6.2.3 网页元素的添加与处理 框架集 表单 基本网页元素： 网页页面属性设置 文本 图像操作 CSS样式 动画、音视频 网页页面属性设置 6.2.3 网页元素的添加与处理 设置网页的标题、背景图像、背景颜色、文本颜色、链接颜色、页边距等，对外观进行整体上的控制，以保证页面属性的一致性。 单击此按钮， 打开“页面属性”对话框 1. 文本操作 6.2.3 网页元素的添加与处理 在网页创作中，网页上的信息大多是通过文字来表达的。文字是最基本的元素之一，具有准确快捷地传递信息、存储空间小、易复制、易保存、易打印等优点，其优势很难被其他元素所取代。 （1）输入文本和空格 （2）文本换行（Enter与Shift+Enter） 例2：打开wy1.html，将网页标题设置为“母亲河”，设置网页的超级链接颜色。 6.2.3 网页元素的添加与处理 在网页中插入图像，可以使网页更加美观，它能装饰网页，表达企业 或个人的情趣和风格。 2. 图像操作 6.2.3 网页元素的添加与处理 插入鼠标经过图像 6.2.3 网页元素的添加与处理 “鼠标经过图像”是指在浏览器中，当鼠标指针移动到图像上时，图像随即变成另外一幅图像，当鼠标指针移开时，又会恢复到第一幅图像。 命令：“插入/图像对象/鼠标经过对象” 例6：在wy1.html网页中插入“鼠标经过图像”，图像为huanghe1.jpg和huanghe2.jpg文件。 6.2.3 网页元素的添加与处理 原始图像 鼠标经过图像 CSS（Cascading Style Sheet）称为“层叠样式表”，简称为“样式表”。CSS是一组格式设置规则，用于控制Web页面元素的外观布局。 使用CSS可以灵活并更好地控制许多文本属性，包括特定字体、大小、粗体、斜体、下划线等。 3. CSS样式 6.2.3 网页元素的添加与处理 （1）CSS规则 6.2.3 网页元素的添加与处理 CSS规则主要有选择器和声明两个部分组成，选择器是表示格式元素的术语，声明用于定义元素样式，如右侧所示的.a1是选择器，介于{}之间的内容就是声明。 选择器 声明 （2）CSS定义 6.2.3 网页元素的添加与处理 例7：建立如图6-2-47所示的CSS规则.a1，并应用到wy1.html的第二段文本上。 步骤： 单击文本“属性”面板上的按钮 ，“目标规则”中选择“新CSS规则” ，单击出现 “新建CSS规则”对话框。 （1）插入Flash动画 Flash动画以其文档容量小、效果丰富等特点深受网页制作者的钟爱。 4. 多媒体操作 6.2.3 网页元素的添加与处理 例8：将Flash文件001.swf插入到新建的网页wy2.html中。 插入Flash动画（“插入/媒体/SWF”菜单命令） 6.2.3 网页元素的添加与处理 选择Flash文件 （2）添加音频（“插入/媒体/插件”） 6.2.3 网页元素的添加与处理 例9：将声音文件ex2.wav添加到网页wy2.html中。 插入音频后，打开“窗口”菜单中的“标签编辑器”，可以对音频进行属性设置。 打开标签编辑器 音频属性设置 （3）添加视频(“插入/媒体/FLV”） 6.2.3 网页元素的添加与处理 例10：将视频文件Musicvedio.flv添加到网页wy2.html中。 FLV视频标签 FLV预览效果 超链接是指页面对象之间的链接关系，只有通过超链接才可以实现在不同网页，乃至不同网站之间的跳转。 超链接就是从一个网页指向一个目标的关系，目标可以是另一个网页，可以是同一网页的不同位置，还可以是一幅图像、一个文件等。 6.2.4. 网页中的超链接 6.2.4 网页中的超链接 例11：在wy1.html中设置第一行中文本“黄河”的超级链接，链接文件为“huanghe.html”。 插入链接对话框 1. 文本链接 在“目标”下拉列表中可以选择超级链接的打开方式。 6.2.4 网页中的超链接 _blank：在一个新的浏览器中打开。 _parent：在父框架中打开。 _self： 在网页所在的窗口或框架中打开，此为默认选项。 _top： 在浏览器窗口打开。 6.2.4 网页中的超链接 2. 图像和图像热区链接 （1）图像链接 创建图像超级链接的方法与建立文本超级链接相似，即选择图像，然后进行超级链接设置。 链接目标为新浏览器窗口 超链接对象 图像对象 6.2.4 网页中的超链接 （1）图像热区链接