《中文版网页制作实用教程》课件第11章.ppt

《《中文版网页制作实用教程》课件第11章.ppt》由会员分享，可在线阅读，更多相关《《中文版网页制作实用教程》课件第11章.ppt（18页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、中文版中文版Dreamweaver CS3实用实用教程教程第第4章章 插入文本和图像插入文本和图像 文本与图像是网页制作中最重要的两大元素。文本组成了大部分网页的结文本与图像是网页制作中最重要的两大元素。文本组成了大部分网页的结构；而图像在页面中的恰当运用，不仅使得网页更加美观，而且令网页表达信构；而图像在页面中的恰当运用，不仅使得网页更加美观，而且令网页表达信息更加直观，吸引了浏览者。本章主要介绍了在通常网页制作过程中如添加并息更加直观，吸引了浏览者。本章主要介绍了在通常网页制作过程中如添加并设置各种文本、图像元素。通过本章知识的学习，用户可以掌握各种编辑网页设置各种文本、图像元素。通过本章

2、知识的学习，用户可以掌握各种编辑网页文本与图像的方法，包括设置文本的格式、使用统一样式、添加按钮、插入背文本与图像的方法，包括设置文本的格式、使用统一样式、添加按钮、插入背景照片、创建鼠标指针经过图像、导航条等。景照片、创建鼠标指针经过图像、导航条等。中文版中文版Dreamweaver CS3实用实用教程教程教学重点与难点教学重点与难点uu 绘制点绘制点 uu 插入文本插入文本uu 编辑文本编辑文本uu 插入图像插入图像uu 编辑图像编辑图像uu 创建网页导航条创建网页导航条中文版中文版Dreamweaver CS3实用实用教程教程4.1 插入文本 文本时网页中最常见也是运用最广泛的元素之一，

3、是网页内容的核心部分。文本时网页中最常见也是运用最广泛的元素之一，是网页内容的核心部分。在网页中哈如文本与在在网页中哈如文本与在WordWord等文字处理软件中添加文本一样方便，可以直接等文字处理软件中添加文本一样方便，可以直接输入文本，也可以从其他文档中复制文本，还可以插入水平线和特殊字符等。输入文本，也可以从其他文档中复制文本，还可以插入水平线和特殊字符等。uu 认识认识“文本文本”插入栏插入栏 uu 插入文本插入文本 uu 插入水平线和日期插入水平线和日期 中文版中文版Dreamweaver CS3实用实用教程教程4.1.1 认识“文本”插入栏 使用使用“文本文本”工具栏，可以快速第插入

4、各种类型的文本。单击插入栏上的工具栏，可以快速第插入各种类型的文本。单击插入栏上的“文本文本”选项卡，打开选项卡，打开“文本文本”插入栏，如图所示。插入栏，如图所示。中文版中文版Dreamweaver CS3实用实用教程教程4.1.2 插入文本插入文本 在在Dreamweaver Dreamweaver CS3CS3中中输输入入文文本本是是非非常常简简单单的的，其其输输入入方方式式与与其其他他文文本本处处理理软件中的文本输入方式十分类似。软件中的文本输入方式十分类似。中文版中文版Dreamweaver CS3实用实用教程教程4.1.3 插入水平线和日期 水平线对于信息的组织很有用，在页面中，可

5、以使用一条或多条水平线来可水平线对于信息的组织很有用，在页面中，可以使用一条或多条水平线来可视化分隔文本和对象，使用段落更加分明和更具层次感。在视化分隔文本和对象，使用段落更加分明和更具层次感。在Dreamweaver Dreamweaver CS3CS3中，还可以插入日期对象，可以以任何格式插入当前的日期中，还可以插入日期对象，可以以任何格式插入当前的日期(可以包括时可以包括时间间)，并且在每次保存文件时都会自动更新该日期。，并且在每次保存文件时都会自动更新该日期。中文版中文版Dreamweaver CS3实用实用教程教程4.2 编辑文本编辑文本 对于插入的文本，可以进行相应的编辑，使枯燥的

6、文本更显生动。编辑文本对于插入的文本，可以进行相应的编辑，使枯燥的文本更显生动。编辑文本的操作主要指设置文本的基本格式，例如文本字体、字体颜色、对齐方式等。的操作主要指设置文本的基本格式，例如文本字体、字体颜色、对齐方式等。uu 设置文本格式设置文本格式 uu 查找和替换文本查找和替换文本 中文版中文版Dreamweaver CS3实用实用教程教程4.2.1 设置文本格式设置文本格式 设置文本格式，可以使文本更加条理清楚、主次分明。可以在文本的设置文本格式，可以使文本更加条理清楚、主次分明。可以在文本的“属属性性”面板中进行相应的设置，完成文本格式的设置。面板中进行相应的设置，完成文本格式的设

7、置。中文版中文版Dreamweaver CS3实用实用教程教程4.2.2 查找和替换文本查找和替换文本 在建立在建立WebWeb站点的过程中，有时会需要更新或者简单地修改某些文本内容。站点的过程中，有时会需要更新或者简单地修改某些文本内容。DreamweaverCS3DreamweaverCS3提供的查找与替换功能，可以快速地打开指定的网页、文件提供的查找与替换功能，可以快速地打开指定的网页、文件夹或站点的文本、夹或站点的文本、HTMLHTML源代码、标签所在的位置，同时还可以对查找到的内源代码、标签所在的位置，同时还可以对查找到的内容进行替换。容进行替换。要使用查找与替换功能，可以选择要使用

8、查找与替换功能，可以选择“编辑编辑”|“|“查找和替换查找和替换”命令，打开命令，打开“查找和替换查找和替换”对话框，如图所示，该对话框中各选项具体作用如下。对话框，如图所示，该对话框中各选项具体作用如下。中文版中文版Dreamweaver CS3实用实用教程教程4.3 插入图像插入图像 图像是网页上最常用的对象之一，制作精美的图像可以大大增强网页的图像是网页上最常用的对象之一，制作精美的图像可以大大增强网页的视觉效果。图像所蕴涵的信息量对于网页而言越加显得重要。在网页中插入图视觉效果。图像所蕴涵的信息量对于网页而言越加显得重要。在网页中插入图像通常是用于添加图形界面像通常是用于添加图形界面(

9、例如按钮例如按钮)、创建具有视觉感染力的内容、创建具有视觉感染力的内容(例如照片、例如照片、背景等背景等)或交互式设计元素或交互式设计元素(例如鼠标指针经过图像或图像地图例如鼠标指针经过图像或图像地图)。uu 网页中常见的图像格式网页中常见的图像格式 uu 在网页中插入图像在网页中插入图像 中文版中文版Dreamweaver CS3实用实用教程教程4.3.1 网页中常见的图像格式网页中常见的图像格式 图像是网页中非常重要的内容。在图像是网页中非常重要的内容。在Dreamweaver CS3Dreamweaver CS3中，可以在页面中插中，可以在页面中插入图像，并利用软件自带的功能设置各种图像

10、效果，例如导航栏、链接和鼠标入图像，并利用软件自带的功能设置各种图像效果，例如导航栏、链接和鼠标经过效果等。经过效果等。网页中常用的图像文件格式有网页中常用的图像文件格式有JPEG(JPG)JPEG(JPG)、GIFGIF和和PNGPNG这这3 3种。种。中文版中文版Dreamweaver CS3实用实用教程教程4.3.2 在网页中插入图像在网页中插入图像 如果网页中的内容全是密密麻麻的文字，无论有多精彩的内容，都容易产如果网页中的内容全是密密麻麻的文字，无论有多精彩的内容，都容易产生厌烦感。所以任何精美的网页中可能没有文本，但不可能没有图像等多媒体生厌烦感。所以任何精美的网页中可能没有文本，

11、但不可能没有图像等多媒体元素，这足见图像在网页中的作用。在网页中适当地插入图像可以使网页增色元素，这足见图像在网页中的作用。在网页中适当地插入图像可以使网页增色不少，更重要是可以借此直观地向浏览者表达信息。不少，更重要是可以借此直观地向浏览者表达信息。中文版中文版Dreamweaver CS3实用实用教程教程4.4 编辑图像编辑图像 在在网网页页中中插插入入图图像像后后，需需要要设设置置图图像像属属性性和和排排列列图图像像与与文文本本之之间间的的位位置置，这这将直接影响网页的整体效果。将直接影响网页的整体效果。uu 设置图像属性设置图像属性 uu 使用图像编辑器使用图像编辑器 中文版中文版Dr

12、eamweaver CS3实用实用教程教程4.4.1 设置图像属性设置图像属性 设置图片属性，主要包括设置图片的大小、对齐方式、边距等。设置图片属性，主要包括设置图片的大小、对齐方式、边距等。中文版中文版Dreamweaver CS3实用实用教程教程4.4.2 使用图像编辑器使用图像编辑器 图像编辑器，主要分为内部图像编辑器和外部图像编辑器。图像编辑器，主要分为内部图像编辑器和外部图像编辑器。中文版中文版Dreamweaver CS3实用实用教程教程4.5 创建网页导航条创建网页导航条“导导航航条条”由由一一个个或或多多个个图图像像组组成成，它它的的显显示示随随着着动动作作的的改改变变而而改改

13、变变，因因此此，在使用导航条命令之前，应首先创建一个用于导航条的图像集。在使用导航条命令之前，应首先创建一个用于导航条的图像集。u 插入导航条插入导航条 uu 编辑导航条编辑导航条中文版中文版Dreamweaver CS3实用实用教程教程4.5.1 插入导航条插入导航条 要在网页文档中插入导航条，要在网页文档中插入导航条，“插入插入”栏中的栏中的“常用常用”选项卡，打开选项卡，打开“常用常用”插入栏，单击插入栏，单击“图像图像”按钮右边的下拉箭头，在弹出的菜单中选择按钮右边的下拉箭头，在弹出的菜单中选择“导航条导航条”命令，打开命令，打开“插入导航条插入导航条”对话框，如图所示。对话框，如图所示。中文版中文版Dreamweaver CS3实用实用教程教程4.5.2 编辑导航条编辑导航条 用户在文档创建导航条后，选择用户在文档创建导航条后，选择“修改修改”|“|“导航条导航条”命令，打开命令，打开“修改导修改导航条航条”对话框，如图所示。在该对话框中可以添加图像，或从导航条中删除图对话框，如图所示。在该对话框中可以添加图像，或从导航条中删除图像。用于更改图像或图像组、更改单击项目时所打开的文件、选择在不同的窗像。用于更改图像或图像组、更改单击项目时所打开的文件、选择在不同的窗口或框架中打开文件以及重新排序图像。口或框架中打开文件以及重新排序图像。