《C第3章Dreamweaver网页的内容编辑(29-45)ok》由会员分享，可在线阅读，更多相关《C第3章Dreamweaver网页的内容编辑(29-45)ok（18页珍藏版）》请在金锄头文库上搜索。
1、45第3章 网页的内容编辑第二篇 网页制作技术Dreamweaver网页是互联网信息的载体，网页中的对象有字符、表格、图形、声音、影视、超链接等。本章将介绍在网页中建立、插入、编辑和格式化网页对象的基本方法，介绍运用表格实现对象布局的方法。3.1 页面属性的总体设置图3.1.1 设置标题页面的总体设置就是对作用于整个网页的属性进行设置，包括设置标题、网页头，页面属性等。页面属性主要有的默认字体、背景色、超链接等。3.1.1 设置页面标题和头内容 1设置标题图3.1.2 文件头设置菜单网页标题可以是中文、英文或符号，它将显示在浏览器的标题栏中。设置标题可直接在设计窗口上方的文档工具栏中题栏内输入
2、或更改即可，如图3.1.1所示。 2设置页面头内容 网页的头内容包含了网页的一些重要信息，如关键字、描述文字等，还可以实现一些非常重要的功能，如自动刷新功能。头的内容在浏览器中是不可见的。在插入工具栏中选按钮，展开HTML工具栏，单击最左边按钮的下拉钮，弹出一个下拉菜单，在下拉菜单中列出了文件头的设置项，如图3.1.2所示。选中其中一项，就可以对该项头内容进行设置。现分述如下：图3.1.3 插入关键字 (1) 插入关键字 关键字用于协助网络中的搜索引擎寻找网页而设置的。为了提高查询效率，关键字应当能代表文档的特征，且避免与其他大量文档的关键字重复。设置关键字的方法如下：单击下拉菜单中的“关键字
3、”选项（见图3.1.2），弹出“关键字”对话框（图3.1.3），在该对话框中输入关键字即可。 (2) 插入META标记图3.1.4 设置META信息 META标记用于记录当前网页的备查信息，如编码，作者，版权等信息。在图3.1.2 所示下拉菜单中选“META”项，弹出“META”对话框（图3.1.4），在对话框的“属性”下拉列表中选择“名称”属性，在“值”文本框中输入相应的值，就可以定义相应的信息，。例如要设置网页作者信息，可在“值”文本框中输入“网页作者”，在“内容”文本框中输入作者信息即可。(3)插入说明图2.1.5 设置刷新头信息中的说明，是在网页中插入对该网页的说明内容。在图3.1.2
4、中选“说明”选项，弹出“说明”对话框，在该对话框中填入说明文字即可。 (4)插入刷新在图3.1.2中选“刷新”选项，弹出“刷新”对话框（见图3.1.5），在该对话框中设置刷新。可设置网页经过多少秒刷新一次，还可设置刷新网页时转到URL。3.1.2设置页面属性 单击“属性”面板下部的“页面属性”按钮，可打开“页面属性”对话框，如图3.1.6所示。“页面属性”按钮的位置可参见图2.1.7。 通过“页面属性”对话框可以设置页面的外观、链接、标题等属性。图3.1.6页面属性对话框1设置外观设置网页外观就是设置页面文本的默认字体、字号、文本颜色、背景颜色和背景图像等基本属性。它是在“页面属性”对话框中选
5、“外观”选项完成的，如图3.1.6所示。2设置链接在“页面属性”对话框的“分类”列表中选择“链接”，则对话框如图3.1.7所示。在这个对话框中可以进行一些与页面的链接效果有关的设置。“链接颜色”定义超链接文本默认状态下的字符颜色，“变换图像链接”定义鼠标放在链接字符上时字符的颜色，“已访问链接”定义访问过的链接的文本颜色 ，“活动链接”定义活动链接的颜色，“下划线样式”可以定义链接的下划线样式。3设置标题图3.1.8 设置标题格式对话框图3.1.7设置页面链接在“页面属性”对话框的“分类”列表中选择“标题”选项，对话框如图3.1.8所示，运用这个对话框可以设置各级标题的外观样式。3.2 文本的
6、插入与编辑 文本携带信息量大，占用空间小，显示时间快，是网页中的基本元素。3.2.1 插入文本 向网页中添加文本的方法有三：，直接在Dreamweaver“文档”窗口中键入文本，用“剪切粘贴”的方法插入文本，从Word文档导人文本。 将插入点移到文档中待插入文本的位置（用鼠标在该点单击），这就在窗口中设定了文字的起始位量，便可将文字素材插入到该文档中。3.2.2 编辑文本格式 网页的文本分为段落和标题两种格式。图3.2.1页面属性对话框 在文档编辑窗口中选中一段文本，在“属性面板”的“格式”下拉列表框中选择“段落”，可把选中的文本设置成段落格式，若选择“标题1”到“标题6”某级标题，则可将文本
7、设置成该级标题的格式。设置方法请参见图3.2.1。对于段落和标题文本，都可以在“属性”面板中定义文字的字号、颜色、加粗、倾斜、水平对齐等格式。3.2.3编辑字体列表只有在字体列表中有的字体才可以使用，如果要使用某一中文字体，则必须将它添加到列表中。编辑字体列表的步骤如下； 图3.2.3“编辑字体列表”对话框 在“属性”面板中单击“字体”栏后的下拉钮，则弹出字体列表（见图3.2.2）。由图可见，表中只有6种西文字体和一个中文宋体可用。图3.2.2 字体列表 在图3.2.2所示列表中单击 “编辑字体列表”，则弹出“编辑字体列表”对话框（图3.2.3）。 在“编辑字体列表”对话框中，选中“在以下列表
8、中添加字体”，再从“可用字体”列表框中选择想要的字体，例如选“方正舒体”，再单击旁边的“添加”按钮，该字体就可以加到字体列表中。 单击“确定”钮，则完成字体添加。关闭对话框。3.2.4文本的其他设置1文本换行图3.2.4 设置连续空格输入在文本编辑中，按Enter键换行的行距较大（在代码区生成标签），按Enter+ Shift键换行的行间距较小（在代码区生成标签）。2在文档中输入连续空格在默认情况下，给文档中一处输入连续多个空格，但文档只保留一个空格。如果要保留多个空格则需按以下步骤设置： 选菜单命令“编辑首选参数”，则弹出“首选参数”对话框，如图3.2.4所示。 在对话框的“分类”列表中选“
9、常规”选项，然后勾选“允许多个连续的空格”复选框(图3.2.4)。 单击“确定”钮，则完成输入连续空格设置，关闭对话框。此后可以直接按“空格”键给文本添加空格了。3特殊字符向网页中插入特殊字符的步骤如下：图3.2.5插入特殊字符 在插入工具栏选择“文本”，则切换到字符插入栏，如图3.2.5所示。 单击文本插入栏的字符按钮的下拉钮（图3.2.5右端），则弹出如图3.2.5右侧所示的下拉列表。下拉列表中列出了可输入的特殊字符。 按照下拉列表的提示，向网页中插入特殊符号。4插入列表列表分为两种，项目列表和编号列表。项目列表没有顺序，每一项前边都以项目符号打头，如图3.2.6上部所示；编号列表前边的每
10、一项有序号引导，如图3.2.6下部所示。插入列表的步骤如下： 在文档编辑窗口中选中需要设置的文本。 在“属性”面板中单击项目列表钮，则选中的文本被设置成项目列表，单击编号列表钮，则被设置成编号列表。5插入水平线水平线在文档中可以起到分隔文本的排版作用。插入水平线的步骤如下： 在插入工具栏选择“HTML”项。 将光标移到文档中待插入水平线的位置。 在插入工具栏单击水平线按钮，则在插入点插入了一条水平线。 选中插入的水平线，在“属性”面板中对水平线的其它属性完成设置。6插入日期步骤如下： 将插入工具栏切换为“常用”项，常用工具栏如下： 在文档编辑窗口中，将插入点移到要插入日期的位置。 单击常用工具
11、栏中的“日期”按钮，则弹出的“插入日期”对话框（见图3.2.7）。项目列表编号列表图3.2.6 插入列表图3.2.7 插入日期对话框 选择相应的日期格式，再按确定钮，则当前日期插入到插入点。在网页中，可以实现如字幕一样的滚动文字，以增强网页活力。在“设计”视图下将光标定位在滚动文字的位置，切换到“代码”视图，在文字前添加标记，在文字后添加标记，预览网页就可以看到文字从左向右滚动的效果。可以按以下格式设置滚动字幕的效果。 标记中的参数说明如下：Direction：用于设置滚动的方向，取值可以是left、right、up或down，分别代表向左、向右、向上、向下运动。Scrollamount：用于
12、设置滚动的速度。Behavior:用于设置滚动的方式，scroll代表循环滚动，slide代表只滚动一次，altemate代表来回滚动。例如，设置滚动字幕方向为向左，速度为5，循环滚动，在文字前添加以下代码：还可以对滚动字幕添加动作。例如，希望当鼠标指向滚动字幕时字幕停止；离开时继续滚动。应设置代码如下：从右向左滚动的效果 3.3插入图像图像快速形象地传递信息，能赋予网页更多的新鲜感与活力。然而，若插入的图像容量太大，就会影响浏览速度，令用户无法容忍。但是图像太小，又会降低图像质量，这就要求在容量和质量之间权衡。 在Dreamweave网页中插入图像的格式通常是GIF、JPEG或PNG。3.3
13、.1 插入图像 在制作网页时，先构想好网页布局，并在图像处理软件中将需要插入的图片进行处理，然后存放在站点根目录下的文件夹里。插入图像时，先将插入点移到网页中，再使用菜单命令“插入图像”，或使用“常用”工具栏中选择“图像”按钮，都可弹出“选择图像源文件”对话框，在该对话框中选择要插入的图像文件，单击“确定”按钮，就可把图像插入到网页中。【例3.3.1】向网页中插入一位歌手图像。操作如下： 将歌手图像复制到网站根目录下的PIC文件夹中，并另存为GIF格式。 将插入点移到网页中待插入图像的位置。图3.3.1 “选择图像源文件”对话框 选菜单命令“插入图像”，则弹出“选择图像源文件”对话框，如图3.
14、3.1所示。图3.3.2 图像标签辅助功能属性对话框 在对话框的“查找范围”栏指定图像文件所在的路径，这里选“G:Site1picSinger”,在“文件名称”栏指定图像的文件名。这里选“宋祖英”。按“确定”钮，弹出如图3.3.2所示“图像标签辅助功能属性”对话框。 在对话框的“替换文本”栏输入替换图像的文本。当图像无法显示时，将显示替换图像的文本。这里输入“宋祖英”。 按“确定”钮，关闭对话框，则图像插入到网页中。则插入图像完成。 将指针移到图像的控点上，调整到适当大小，直至满意为止。图3.3.3 图像属性面板 如果在网页中选中插入的图像，则在属性面板中显示图像的属性，如图3.3.3所示。在图像属性面板的左上角，显示当前图像的缩略图，同时显示图像的大小。在缩略图右侧有一个文本框，在其中可以输入图像标记的名称。图像的尺寸大小是可以改变的，当对图像进行缩放等处理时，属性栏中“宽”和“高”的数值会以粗体显示，并在旁边出现一个弧形箭头，单击它可以恢复图像的原始大小。 “水平边距”和“垂直边距”文本框用来设置图像左右和上下与其他元素的距离。“边框”文本框是用来设置图像边框的宽度，默认的边框宽度为
