3.1 网页上的文本编辑(课件）-高二《网页设计与制作》同步教学（中国人民大学出版社）

第3章 网页图文 教学任务： 输入文本和文本编辑 插入和编辑图像、图文混排 用CSS样式设置文本格式 教学重点与难点： 图文混排 用CSS样式设置文本格式 文本是大多数网页的主要内容，Dreamweaver CS4提供段落文本的基本工具，可以编排段落、建立与更改项目符号等，能够更随心所欲地安排网页内容。 让网页更加动人的诀窍，在于使用精美的图片帮衬，可将标题做成一张图片，让标题醒目，也可以替网页加上背景图等，如果网页缺少了图片的点缀，那么就会逊色许多。 3.1 网页上的文本编辑 3.1.1文本插入与编辑 1.文本的插入 文本是网页的最基本元素，在Dreamweaver中除了可以直接输入文本，还可以从外部导入文本文件。 利用导入功能，加载现存的文本文件， 可以大大的提高工作效率。 以下是将文本文件置入网页中的操作步骤： ②移动鼠标到菜单栏执行【文件】→【打开】命令，选择并打开所需的文本文件。如图3-1所示。 提示：在【文件】面板中双击相应的文本文件也可打开。 ②Dreamweaver会自动打开纯文本格式的文本文件，接着执行菜单栏【编辑】→【全选】命令。如图所示。 ③选取文本后，执行菜单栏【编辑】→【拷贝】命令。 ④切换至编辑窗口后，移动鼠标到菜单栏执行【编辑】→【粘贴】，将复制的文本粘贴到网页上。 除了导入文本文件外，若看到别人的网页内容，有可以借鉴的，也可以利用复制HTML与粘贴HTML功能，把那一段文本连同格式复制过来。 2.文本的编辑 网页上的段落文本分为： 有项目符号。 没有项目符号。 分隔段落文本有两种方法： 按【Enter】键分段会造成较大行距的段落间距。 按【Shift+Enter】键则只是换行而已。 （1）编排文本段落 ①将光标移到要分段的位置后，按下【Enter】键。 ②当按下【Enter】键时，则会造成较大行距的段落。如图所示。 若按下【Shift】+【Enter】键，则只是强迫文本换行而已。如图所示。 （1）修改文本颜色与字体 ① 移动鼠标选取文本后，打开【属性】面板，在“格式”列表中选择标题1，接着在“字体”列表中选择“编辑字体列表”。 ②出现【编辑字体列表】对话框后，在“可用字体”列表中选择要置入的字体，接着单击 按钮。如下图所示。 ③将需要使用到的字体置入“选择的字体”列表中后，最后选择 按钮。 ④回到编辑画面后，移动鼠标到“字体”列表中选择刚才新增的字体。 再单击 文本颜色按钮，从弹出的色板中选择文本的颜色，如图所示。然后选择　 居中对齐按钮，将文本居中对齐。 3.1.2列表设置 当需要条列式一项一项列出内容时，使用项目符号工具就可以在每一个项目前面加上符号或编号。 1.设置列表 选取要设置项目符号的内容后，接着启动【属性】面板，然后单击 项目列表按钮。设置完项目符号后显示出如下图所示的效果。 若单击 编号列表按钮，则项目前面加上的是数字编号，如图所示。 2.更改项目符号样式 在【属性】面板里，系统默认的列表项目有项目列表和编号列表两种，也可以修改符号或编号的样式。 更改项目符号或编号样式的操作步骤如下： （1）将光标移到列表项目中，打开【属性】面板，接着单击 按钮。 （2）出现【列表属性】对话框后，在“列表类型”菜单中选择“项目列表”或“编号列表”（如图所示），接着在“样式”下拉列表中选择相应的符号或编号（如图所示），然后单击 按钮。 由于所有的列表项目被视为同一个段落，因此完成设置后，所有项目符号或编号就会变成所选的正方形或大写罗马数字（如图所示），而不需要一项一项修改。 $$