3.1 网页中的文本

网页中的文本是构成整个网页的灵魂，由于文本产生的信息量大，输入、编辑简单方便，并且生成的文件小，容易被浏览器下载，因此掌握好文本的使用，是制作网页的最基本的要求。本节详细讲解在网页中添加文本、添加特殊字符、设置项目列表、设置编号列表的方法，以及设置文本属性的方法。

3.1.1 直接输入

将光标定位到文档窗口中想要插入文本的位置，调整好输入法，就可以直接输入设定的文本内容，如图3-1所示。

操作点拨：

DW中不允许输入多个连续的空格，在此提供几种输入空格的方法。

① 设置“首选参数”对话框中的“允许多个连续的空格”复选框为选中状态。

② 设置输入法为全角状态，可以输入多个连续空格。

③ 通过〈Ctrl+Shift+Space〉组合键，可以输入多个连续空格。

④ 在“代码”视图中输入“ ”代码，可以在“设计”视图中产生空格。在“代码”视图中输入几次“&nbsp”，在“设计”视图中就会出现几个空格。

Dreamweaver中可以通过〈Enter〉键对文本进行分段，按〈Shift+Enter〉组合键实现换行，将上下两行的行间距变为分段行间距的一半。

3.1.2 复制/粘贴外部文本

除了直接输入文本外，Dreamweaver中还可以复制其他外部程序（如Word、记事本等）中的文本到网页中，在Dreamweaver CS6中将光标移动到要插入文本的位置，执行“编辑”→“粘贴”命令，就可以实现外部文本的复制与粘贴，如图3-2所示。粘贴后的文本不再保留其他应用程序中的文本格式（如分段、粗体等），但保留换行符。

操作点拨：

如果想要将外部程序中的分段、加粗等格式一起复制到Dreamweaver中，可以执行“编辑”→“选择性粘贴”命令，弹出的对话框如图3-3所示，从中可进行设置。

提示：

在Dreamweaver CS6的文本编辑特性中，除了具有个别面向Web的特性外，其余操作和Word等文字处理软件很相似，例如“剪切”“复制”“粘贴”“移动”“撤销”“恢复”等命令。

3.1.3 导入外部文件

在Dreamweaver CS6中，用户可将Word或Excel中的内容完整地插入到网页中，两者的导入方法完全相同。本小节讲述导入Word文档的方法，执行“文件”→“导入”命令，打开“导入Word文档”或“导入Excel文档”对话框，“导入Word文档”对话框如图3-4所示。

操作点拨：

在图3-4中，可以从“格式化”下拉列表中选择要导入文件的保留格式，其中各选项的含义如下。

仅文本：导入的文本为无格式文本，即文件在导入时所有格式将被删除。

带结构的文本：导入的文本保留段落、列表和表格结构格式，但不保留粗体、斜体和其他格式设置。

文本、结构、基本格式：导入的文本具有结构并带有简单的HTML格式。如段落和表格，以及带有<b>、<i>、<u>、<strong>、<em>、<hr>、<abbr>或<acronym>标签的格式文本。

文本、结构、全部格式（粗体、斜体、样式）：导入的文本保留所有结构、HTML格式设置和CSS样式。

3.1.4 插入特殊字符

网页中不仅包含普通文本还经常会用到一些特殊符号，这些特殊符号是无法通过键盘输入到文档中的，如注册商标符号®、版权符号©等。若要在网页中输入这些特殊符号，可执行“插入”→“HTML”→“特殊字符”菜单命令，从其子菜单中选择相应的符号命令。如果在该子菜单中不能找到需要的符号，可以选择“其他字符”命令，打开图3-5所示的“插入其他字符”对话框，在其中选择要插入的字符即可。

3.1.5 插入项目列表和编号列表

Dreamweaver可以为网页中具有相同类型的文本段落添加上项目符号或编号，使之成为列表，以达到网页内容结构清晰、页面整洁有序的效果，设置项目符号后的网页效果如图3-6所示。Dreamweaver CS6有两种文本列表，分别是项目列表和编号列表，下面详细介绍这两种列表的设置方法。

1．项目列表

项目列表可用于对具有相同类型的信息集合添加项目符号来作为标记，进行无序的排列。

插入项目列表的具体操作步骤如下。

1)在文档中输入文本内容，然后用鼠标选中要插入项目列表的文本内容，如图3-7所示。

2)执行“窗口”→“插入”菜单命令，打开“插入”面板，然后将其切换到“文本”对象，接着选择项目列表中的“项目列表”选项，如图3-8所示。

操作点拨：

除上述方法外，设置项目列表还有以下几种方法。

① 单击“属性”面板中的“项目列表”按钮，也能为文本添加项目列表。

② 执行“插入”→“HTML”→“文本对象”→“项目列表”命令，也可以设置项目列表。

这样就能在选定的文本前面添加或修改项目列表，效果如图3-9所示。

2．编号列表

编号列表可用于对具有相同类型的信息集合添加编号来作为标记，进行有序的排列。在文档窗口选定要插入编号列表的内容，然后选择“文本”对象中的“编号列表”选项，或者在“属性”面板中单击“编号列表”按钮，即可插入编号列表，插入编号列表后的效果如图3-10所示。

3.1.6 设置文本属性

网页中添加了文本后，还可以设置文本的字体、字号、颜色等属性。要在Dreamweaver CS6中设置文本属性，可以通过HTML和CSS两种方法来实现。使用HTML类型时，Dreamweaver会自动为文本添加相应的HTML标签或标签属性，可以从“代码”视图中查看；使用CSS类型时，Dreamweaver会使用CSS样式表设置文本属性，可以从CSS面板查看。

1．HTML类型

选择要设置属性的文本对象，“属性”面板默认显示文本的HTML类型的相关属性，如图3-11所示。

面板中的各属性含义如下。

“格式”：设置文本的格式，如段落格式、标题格式和预先格式化等。

提示：

标题格式主要用于强调文本信息的重要性。使用标题格式后的文本一般会加粗显示，HTML预设了6级标题格式，标签为<h1>、<h2>、<h3>、<h4>、<h5>、<h6>，文本大小依次递减。

段落格式主要用于给文本设置段落格式。HTML代码中使用<p>标签表示。设置了段落格式的文本会在上、下各显示一行空白间距。

“ID”：为所选文本应用一个下拉列表中未声明过的ID样式。

“类”：为文本应用一个类选择器样式。

提示：

本书的后续章节将详细介绍创建CSS样式的类、ID或标签选择器，以及设置相应格式的方法。创建完成之后就可以在“属性”面板的HTML类型界面中的“ID”或“类”的下拉列表中选择，并自动应用设置好的文本格式。

“粗体、斜体”：将文本显示为粗体或斜体。在“代码”视图中可以查看到<strong>和<em>标签。

“项目列表和编号列表”：将所选文本段落设置为项目列表或编号列表形式。

“文本缩进”：缩进所选文本或删除所选文本的缩进。

“链接、标题、目标”：为所选文本设置超链接及打开超链接文档的方式，具体方法将在后面章节中详细介绍。

2．使用CSS类型

由于Dreamweaver是基于层叠样式表（CSS）进行设置的网页编辑软件，即事先定义好文本的CSS样式，再应用到选定的文本上。当需要修改文本的外观时，只需要修改CSS样式属性就可以自动使文本显示最新的样式属性。因此，使用CSS类型设置文本的外观属性才是更快捷的方法。单击“属性”面板左侧的CSS按钮，可显示文本的CSS类型属性，如图3-12所示。

面板中的各属性含义如下。

“目标规则”：显示当前选定内容所使用的CSS规则名称，也可以从下拉列表中为选定的内容新建CSS规则。

“字体”：设置或更改目标规则的字体。

提示：

在“字体”下拉列表中选择“编辑字体列表”选项，将打开“编辑字体列表”对话框，如图3-13所示。在“可用字体”列表框中选择一种字体，然后单击“添加”按钮，可将选中的字体加入到“选择的字体”列表框中。如果还想添加其他字体，可继续执行上面的操作。添加完后单击“确定”按钮，关闭“编辑字体列表”对话框，此时，“字体”下拉列表中将会显示添加的字体。

“大小”：设置或更改目标规则的文本大小。

“文本颜色”：设置或更改目标规则的文本颜色，可以单击颜色框，从颜色面板中选择文本颜色，也可以用拾色器选取其他颜色，还可直接在颜色框右侧的文本框中输入表示颜色的十六进制数，例如“#0000FF”。

“粗体”：向目标规则添加粗体属性。

“斜体”：向目标规则添加斜体属性。

“左对齐、居中对齐、右对齐和两端对齐”：向目标规则添加各种对齐属性。