第五章格式化文本

无论制作网页的目的是什么，文本都是网页中不可缺少的东西。良好的文本格式，能够充分体现文档要表述的意图，激发读者的阅读兴趣。在文档中构建丰富的字体、多种的段落格式以及赏心悦目的文本效果，对于一个专业的网站来说，是必不可少的要求之一。

Dreamweaver是一种所见即所得的网页创作工具，这意味着对文本格式的设置，可以直接从屏幕上看到设置结果，Dreamweaver提供了强大的文本格式化功能，您几乎可以随心所欲地对文档进行各种格式化操作。

本章将介绍如何在Dreamweaver 3中，对文本进行格式化操作。

文本格式化操作概述

在Dreamweaver 3中，文本的格式化操作是非常简单的，Dreamweaver很像一个普通的字处理程序，例如Word，用户几乎凭借直觉，就可以完成对文本的格式化操作。

格式化文本的三种方式

在Dreamweaver中，要格式化文本，通常可以使用三种方式：

第一种方式是直接使用HTML标记，例如，可以使用标题1标记<h1>来将一行文本设置为标题1格式，或是使用粗体标记来将选中的文本字符设置为加粗格式。

第二种方式是对前一种方式的扩展，实际上是将HTML标记组合起来，然后将之命名为一个新的格式。在Dreamweaver中，这种有现有HTML标记组合而成的格式被称作HTML样式。例如，如果希望将一些文本设置为粗体和斜体，采用第一种方式，需要对这些文本分别设置2次格式，一次设置粗体，一次设置斜体；而采用第二种方法，可以首先将粗体斜体这两个格式化操作组合成一个操作，也即生成一个新的HTML样式，并以一个容易懂的名字命名，当需要将文本设置为粗体和斜体时，在文本上应用该新创建的HTML样式即可。

第三种方式是使用CSS，也即层叠样式单。CSS是一种对文本进行格式化操作的高级技术，它从一个较高的级别上对文本进行控制。它的特点是可以对文本的格式进行精确控制，而且可以在文档中实现格式的自动更新。利用CSS，可以对现有的标记格式进行重新定义，也可以自行将某些格式组合定义为新的样式，甚至可以将格式信息定义于文档之外。由于CSS的相关内容较多，我们将它放在下一章介绍，在阅读了相关内容之后，我们就可以体会到CSS的优势所在。

用户需要注意的是，采用标准的HTML标记来格式化文本，这样所创作出来的页面可以被几乎所有的浏览器所支持，但是如果使用CSS来格式化文本，则只有较新版本的浏览器，如Microsoft Internet Explorer 4.0或Netscape Navigator 4.0，才能正确显示这些网页。Internet Explorer 3.0只能识别一部分CSS格式，因此也不建议使用该版本的浏览器。而使用其他版本较低的浏览器时，则通常会忽略这些格式设置，不能正确显示网页。

另外一点需要指出的是，上面提到了三种对文本进行格式化操作的方式，实际应用时，它们之间是不相互排斥的，换句话说，您可以在一个网页中，任意使用这三种方式来实现格式化文本的目的。

理解段落和字符

在格式化文本操作中，理解段落和字符的差别显得非常重要。

段落

所谓段落，就是一段格式上统一的文本。在文档窗口中，每输入一段文字，按下回车键后，就自动生成一个段落。按下回车键的操作通常被称作硬回车，可以说，段落就是带有硬回车的文字组合。

在HTML中，段落主要由标记和所定义，在Dreamweaver的文档窗口中，每按下一次回车键，都会自动为上面输入的段落包围上和标记。例如，如下的代码显示了一段文字：

我们“微文工作室”，是一个年轻的、充满朝气和活力的工作室，致力于为广大用户提供各种实用的、可靠的和详尽的计算机书籍。

注意：实际上，有时候可以不使用和标记，而是采用其他类型的标记来定义段落。例如，将一行文字设置为标题1格式，实际上是将该行文字两端添加<h1>和</h1>标记，它一方面定义了该行文字的标题级别，另一方面也起到定义该行文字为一个段落的作用。

一般来说，段落中文本的换行是自动进行的，在大多数情况下，它由浏览器的窗口大小来决定。在浏览网页时，不同的窗口大小，可能导致段落中换行位置发生变化，同样在文档窗口中，窗口的大小也会影响段落的显示。图 5‑1和图 5‑2显示了当改变文档窗口大小时，其中段落文本换行的情形。

图 5‑1 文档中显示的段落

图 5‑2 文档中段落的自动换行

有时候希望将一组文字设置为一个段落，但是又希望在其中某个位置强制断行，这时可以使用 标记。它用于在段落中指定位置将文字断行，但是上下两块文字仍然属于统一个段落，换句话说，对于断行位置上面文字设置的段落格式设置同样会影响到断行位置下方的段落格式。

例如，如果我们希望在上面示例的文字段落中，在“致力于”前面强制断行，则可以使用如下代码：

我们“微文工作室”，是一个年轻的、充满朝气和活力的工作室， 致力于为广大用户提供各种实用的、可靠的和详尽的计算机书籍。

这时在文档窗口中，您可以看到在“致力于”前面产生了换行效果，如图 5‑3所示。

图 5‑3 段落中的强制断行

有一点很重要，在HTML源代码中，仅仅按下回车键是无法实现换行的目的的。

例如，如果将上面示例的源代码写成：

我们“微文工作室”，是一个年轻的、充满朝气和活力的工作室，

致力于为广大用户提供各种实用的、可靠的和详尽的计算机书籍。

实际显示的结果并不会出现如图 5‑3所示的强制换行效果，而仍是显示为图 5‑1所示的情形。

当然在文档窗口中，按下回车键可以实现换行，但是这实际上生成的是新的段落。

字符

所谓字符，实际上就是文档中的文字本身，一个字母、一个汉字都是字符，字符是组成段落的基本单位。

字符同字体不同，字符主要指的是用户所输入的文字信息，包括中文汉字、西文字母、阿拉伯数字以及其它一些特殊符号，这些字符事实上是十六进制的数，通过字符映射显示为字符本身的图形，例如英文字母由一个ASCII码组成，汉字则由两个十六进制数（称作内码）组成。

字符的外观通常被称作字体，所谓字体，实际上是具有某些特定设置的字符的集合。它可以按照您的希望而改变，例如，可以改变字符字体的大小、颜色等特性，但是该字体所对应的字符本身并没有发生变化，一个红色的字符“A”和一个“黄色”的字符“A”，它们只是颜色不同，但都是字符“A”。

在文档中所能够使用的字体种类以及设置，通常和在Windows中安装了哪种字体有关。Windows在默认情况下已经安装了许多字体，您也可以安装自己需要的字体，或对现存的各种字体进行增删和设置操作。

由于字体是可以增删的，所以在HTML文档中，不应该使用那些很特殊的，可能只在创作者计算机上才有的字体。如果浏览器所在的计算机中没有安装相应字体，那么查看到的网页格式当然也不会正确。在大多数情况下，如果没有相应的字体，浏览器会使用默认字体来显示这些文字。

对段落或字符的格式化

对文本的格式化实际上包括对段落的格式化和对字符的格式化两个方面。在HTML文档中，每个段落都可以有其自己的相对其他段落独立的格式，对段落的格式化操作控制段落的整体格式，例如段落的缩进方式、段落的对齐方式、段落的列表方式等；而对字符的格式化操作则只针对字符本身，例如，可以将某个段落中的某些文字设置为粗体格式。

在格式化之前，需要首先选中被格式化的对象，由于格式化内容的不同，选中的对象也不同，如果希望设置段落格式，只需要将插入点放置到段落中任意位置即可，也即只要确保插入点位于该段落的和之间。如果希望设置文本的字符格式，则需要选中这些文字，使这些文字被高亮。图 5‑4显示了这两种操作的区别

图 5‑4 设置插入点和选中文字

当然，如果选中整个段落，也可以对段落格式进行设置。但是这时需注意，应该连段落两端的和标记一起选中，否则只能设置字符格式。

使用HTML标记格式化文本

使用HTML标记格式化文本，这是最为“正统”的格式化方式。利用HTML标记，您可以对段落和字符进行丰富的格式化设置。

设置段落格式

良好的段落格式可以使文档清晰易读，便于理解，利用HTML的标记，可以端对段落的多种格式进行设置。

定义段落

一般来说，每在文档窗口中输入文字，然后按下回车键，即可将之定义为一个段落，Dreamweaver会自动为段落文字两端添加上和标记。

和标记主要用于定义一个段落，在段落的内容可以是文本，也可以是图像等其他类型的对象。浏览器在处理标记时，通常将它所包容的段落同上一段落之间用一个空行隔开。

和标记之间不能包括其他的标记，但是可以带有许多属性，如align（对齐）属性等。

有时候也可以手工将文档窗口中的文字定义为段落，方法如下：

1. 将插入点放置在要定义为段落的文字中。

2. 打开“Text”（文本）菜单，选择“Format”（格式化），再选择“Paragraph”（段落）命令，如图 5‑5所示，这时插入点所在的文字块就被定义为段落，其两端分别被添加和标记。

图 5‑5 设置段落格式的菜单

3. 如果希望取消对段落的指定，可以从菜单上选择“None”（无）。

使用属性面板同样可以定义段落，打开属性面板上的“Format”（格式化）下拉列表，然后从菜单上选择“Paragraph”（段落）命令，即可将当前插入点所在位置的文本设置为段落，如果从菜单中选择“None”（无），则会取消对段落的定义，如图 5‑6所示。

图 5‑6 定义段落

设置标题

一般用标题来强调段落要表现的内容，在HTML中，定义了6级标题，从1到6级，每级标题的字体大小依次递减。

在HTML中，采用如下的标记来定义标题：

<h1>和</h1> 定义标题1

<h2>和</h2> 定义标题2

<h3>和</h3> 定义标题3

<h4>和</h4> 定义标题4

<h5>和</h5> 定义标题5

<h6>和</h6> 定义标题6

每级标题的字符大小并没有一个实际上的固定的值，它是由浏览器所决定的，为标题定义的级别只决定了标题之间的相互大小。

在标题标记中，最主要的属性是align（对齐）属性，用于定义标题段落的对齐方式，例如，如果希望将“这是标题1”定义为1级标题，并居中显示，则可以使用如下的语句：

注意：标题标记不仅能够定义标题级别，而且也起到定义文档段落的作用，也就是说，它同时还起到和标记的作用，所以，当将一行文字指定为标题后，就不用再在它两端添加和标记了，它自动成为一个段落。如果原先段落两端已经有和标记，标题标记会替换它们。

要在Dreamweaver中设置标题，您可以按照如下方法进行操作：

1. 在文档中，将插入点放置到要设置标题的段落中，通常该段落是一行文字。如果希望将多个段落设置为标题，可以选中这多个段落。

2. 打开“Text”（文本）菜单，选择“Format”（格式），再选择相应的标题级别菜单项。可选的标题级别菜单从“Heading 1”（标题1）到“Heading 6”（标题6），分别对应了标题1到标题6，请参看如图 5‑5所示的菜单。

使用属性面板同样可以定义标题，打开属性面板上的“Format”（格式）下拉列表，然后从菜单上选择相应的“Heading 1”（标题1）、“Heading 2”（标题2）等命令，即可将当前插入点所在位置的文本设置为相应级别的标题，请参看图 5‑6所示的属性面板。

也可以使用组合键“Ctrl+相应的标题级别数”来快速定义标题，例如，Ctrl+1将当前插入点位置的段落定义为标题1，Ctrl+2将当前插入点位置的段落定义为标题2，等等。

图 5‑7显示了这6级标题的文字大小。

图 5‑7 HTML中的6级标题

定义预格式化文本

编辑过网页的人都知道，在HTML源代码中，您无法输入多个空格，例如，下面的两条语句实际上的显示效果是一样的：

微文工作室周明涛

在上面的例子中，无论第二条语句中添加多少空格，浏览器都会把它当作一个空格来处理。有时候在显示一些需要特殊格式的文本时（例如诗歌），这一点显得非常不便。

在HTML中，使用预格式标记<pre>和</pre>来解决这个问题，所谓预格式化，指的就是用户预先对<pre>和</pre>之间的文字进行格式化，浏览器在显示其中的内容时，会完全按照其真正的文本格式来显示，例如，原封不动地保留文档中的空白，例如空格、制表符等。这样，下面两条语句的显示效果就完全不一样了：

<pre>微文工作室周明涛</pre>

注意：预格式化文本不能被自动换行。因此，如非绝对必要，尽量不要使用预格式化文本特性。

要在Dreamweaver中指定预格式化文本，可以按照如下方法进行操作：

1. 将插入点放置到要设置预格式化的段落中，如果要将多个段落设置为预格式化，可以选中这多个段落。

2. 打开“Text”（文本）菜单，选择“Format”（格式），再选择“Preformatted Text”（预格式化文本）命令，也可以在属性面板上打开“Format”（格式）下拉列表，再选择“Preformatted”（预格式化）。请参看图 5‑5和图 5‑6。

3. 如果必要，可以继续对文档窗口中的文本进行像操作纯文本一样的格式化操作，例如输入空格对齐文本等。

该操作自动在相应段落的两端分别添加<pre>和</pre>标记，如果原先段落两端有和标记，则会分别用<pre>和</pre>标记替换它们。

对齐段落

段落的对齐方式，指的是段落相对文档窗口（或浏览器窗口）在水平位置的对齐方式。有三种对齐方式：左对齐、居中和右对齐。

您可以按照如下方法进行操作：

1. 将插入点放置到要设置对齐方式的文档中，如果要设置多个文档段落的对齐方式，可以选中这些段落。

2. 打开“Text”（文本）菜单，选择“Alignment”（对齐），再选择相应的对齐方式菜单项，这里有三种选择：

l 选择“Left”（左对齐），设置段落相对文档窗口左对齐。

l 选择“Center”（居中），设置段落相对文档窗口居中对齐。

l 选择“Right”（右对齐），设置段落相对文档窗口右对齐。

使用属性面板也可以完成相应功能，单击属性面板上的对齐按钮，即可为当前段落设置对齐方式，如图 5‑8所示。

图 5‑8 属性面板上的段落对齐方式按钮

对段落的对齐操作，实际上设置的是标记的align属性，align属性值可以有三种选择：“left”表示左对齐，“center”表示居中，而“right”则表示右对齐。例如，如下的语句分别为三个段落设置了“左对齐”、“居中”和“右对齐”方式：

这段文字是左对齐的。

这段文字是居中对齐的。

这段文字是右对齐的。

图 5‑9显示了该代码的显示效果，当您改变文档窗口时，会发现段落同文档窗口的相对位置保持不便。

图 5‑9 段落的对齐

缩进段落

许多时候需要缩进段落，例如希望强调一段文字，或引用其他来源的文字，都需要将文字缩进，以示同普通段落的区别。所谓缩进，主要是相对于文档窗口（或浏览器窗口）左端而言的。

要实现段落的缩进，您可以按照如下步骤进行操作：

1. 将插入点放置到要设置缩进的段落中，如果希望缩进多个段落，可以选中这些段落。

2. 打开“Text”菜单，选择“Indent”（缩进），即可将当前段落往左缩进一段位置（一般是2个字符的位置）。选择“Outdent”（反缩进），即可将当前段落往右恢复一段缩进位置。

利用属性面板同样可以完成文档的缩进操作，单击属性面板上的相应的缩进和反缩进按钮，即可实现当前段落的左缩进和反缩进，如图 5‑10所示。

图 5‑10 属性面板上的段落缩进按钮

使用快捷键实现缩进更为简单，按下Ctrl+]组合键则进行一次左缩进，按下Ctrl+[组合键，则往相反方向（右方）恢复一段缩进位置。

段落的缩进设置，实际上是通过使用块引用标记<blockquote>和</blockquote>来实现的。

<blockquote>和</blockquote>标记主要用于在文档中标记一段引用文字，它所包容的文字相对于标记外的文字往左缩进两个字符的距离。在下面的代码中，使用<blockquote>和</blockquote>标记来实现对《大学》经文的引用：

下面一段，是《大学》的总纲：

大学之道，在明明德，在亲民，在止于至善。知止而后有定，定而后能静，静而后能安，安而后能虑，虑而后能得。物有本末，事有终始，知所先后，则近道矣。

</blockquote>

图 5‑11显示了这段代码在文档窗口中显示的效果。

图 5‑11 段落的缩进

<blockquote>和</blockquote>标记可以嵌套使用，每开始一个<blockquote>标记，都相对于上级文字往左缩进两个字符距离，而在每个</blockquote>之后，又相对于引用文字往右凸出两个字符的距离。例如，下面的代码就使用了嵌套的<blockquote>和</blockquote>标记。

江湖上传言：

武林至尊，宝刀屠龙。

号令天下，莫敢不从。

倚天不出，谁与争锋。

</blockquote>

这段代码，在文档窗口中会显示为如图 5‑12所示的情形。

图 5‑12 嵌套缩进

在书写带有嵌套标记的源代码时，最好也采用缩进的方式，这样便于阅读。Dreamweaver会自动以嵌套的方式保存带有嵌套标记的源代码。

<blockquote>标记带有一个cite属性，它指向一个URL，用于表明引用的出处，下面是一个例子：

马克思说：

批判的武器不能代替武器的批判，物质的力量只能用物质来摧毁。

</blockquote>

控制断行

对于用和标记定义的段落来说，段落和段落之间会产生一个空行大小的间距，有时候希望对段落中文字进行强制断行，就不能单纯使用回车的方式。因为这样一来，又产生了一个新段落，而段落和段落之间的间隔比正常的段落中文本行间隔要宽，影响了文本的美观。

任意在段落中回车，还会打乱版面的排版，影响段落格式的设置。因为按下回车后，实际上产生了新的段落，原先对一个段落应用的格式，就不得不分别对两个段落进行设置。

如果希望对段落中的文字进行强制换行，可以使用断行标记 ，它是一个非封闭类型的标记。

要在Dreamweaver中设置断行，可以按照如下方法进行操作：

1. 将插入点放置到要段落中要断行的位置。

2. 打开“Insert”（插入）菜单，选择“Line Break”（断行），也可以单击对象面板上的“Insert Line Break”（插入断行）按钮，如图 5‑13所示。另一个在段落中强制断行的方法是按下Shift+回车组合键。

图 5‑13 对象面板上的插入断行按钮

该操作实际上就是在文档段落中相应位置插入一个 标记。

标记是一个不可见元素，默认状态下，您无法在文档窗口中看到它，如果希望看到文档中的 标记，可以打开“Edit”（编辑）菜单，选择“Preferences”（参数选择）命令，打开Dreamweaver 3的参数选择对话框，然后在左方目录列表中选择“Invisible Elements”（不可见元素）项，再在右边选中“Line Breaks”（断行）复选框。文档窗口中的断行标记会显示为如图 5‑14所示的情形。

图 5‑14 显示断行标记

在图中，6本书的书名都属于一个段落。它和顶行文字分属于两个段落，您可以看到，采用断行标记后，行和行之间的间隔比段落和段落之间的间隔要小。

还有一点需要注意的是，在段落中插入断行后，这些多行文字仍然属于一个段落，换句话说，对于被断行的每行文本所设置的段落格式，都会应用到其他行中。例如，在上图中，如果将“《中文Windows 98入门到精通》”一行设置为居中，则所有的书名行都会居中。

设置字符格式

如果说段落格式能够从整体上把握文档的结构，使文档便于阅读理解，那么良好的字符格式则能够为文档带来细致的美感，进一步突出文档要表达的中心思想。在Dreamweaver中，您对字符的字体、字号、颜色、样式等多方面进行深入的设置。

设置字体

要为字符设置字体，您可以按照如下方法进行操作：

1. 选中要设置字体的文字。

2. 打开“Text”（文本）菜单，选择“Font”（字体），再选择相应的字体菜单项即可，如果希望设置为默认字体（对于简体中文环境来说，一般是宋体），则可以选择“Default Fonts”（默认字体）。

利用属性面板，也可以实现对字符字体的设置。打开属性面板上的字体列表，选择相应字体项即可，如图 5‑15所示。

图 5‑15 利用属性面板设置字符字体

如果在字体列表中没有您需要的字体，则可以按照如下方法编辑字体列表：

1. 打开“Text”（文本）菜单，选择“Font”（字体），再选择“Edit Font List”（编辑字体列表）命令；也可以从图 5‑15所示属性面板上的菜单列表中，选择“Edit Font List”（编辑字体列表）命令。

2. 这时会打开如图 5‑16所示的对话框，允许您定制字体列表。在“Font List”（字体列表）列表框中，显示当前已有的字体组合项；在“Chosen Fonts”（选中的字体）列表中，显示当前选中字体列表项中包含的字体名称；在“Available Fonts”（可用字体）列表中，显示当前所有可用的字体名称。

图 5‑16 编辑字体列表

3. 如果希望编辑现有字体列表中的字体组成，可以从“Font List”（字体列表）列表框中，选中要编辑的字体组合项。如果要创建新的字体列表，可以从列表框中选择“（Add fonts in list below）”（在下面的列表框中添加字体）项。如果没有出现该项，可以单击对话框左上角的加号按钮。

4. 要往字体组合项中添加新字体，可以从“Available Fonts”（可用字体）列表中选择需要的字体名称，再单击“<<”按钮，被添加的字体会出现在左方“Chosen Fonts”（选中的字体）列表中。

5. 要从字体组合项中删除字体，可以从左方“Chosen Fonts”（选中的字体）列表中选择需要的字体名称，再单击“>>”按钮。

6. 如果希望改变某个字体组合项在字体列表中的位置，可以首先从“Font List”（字体列表）列表框中选中该字体组合项，然后按下列表右上方的箭头按钮来改变其位置。

7. 如果希望删除某个字体组合项，可以先从“Font List”（字体列表）列表框中，选中该字体项，然后单击列表左上角的减号按钮。

8. 设置完毕，按下“确定”按钮，确定操作。

通常，对于要创作中文网页的用户，都应该创建两个字体项，一个包括宋体，一个包括黑体。

一般来说，不应该在网页中使用过于特殊的字体，因为对于浏览网页的人来说，其计算机中不一定会安装这些特殊字体，如果浏览到带有这些特殊字体格式的字符，只能以普通的默认字体来显示。对于中文网页来说，应该尽量对汉字使用宋体或黑体，因为大多数计算机中，默认时都安装有这两种字体。

如果为了美观的原因，非要使用特殊的字体，则可以将该使用特殊字体的文字制作成图像，然后插入到网页中，这样即使系统中没有安装该字体的人也能正常浏览网页，看到丰富的图文效果。

我们可以看到，许多字体组合项中包括多个字体的名称，在显示网页时，浏览器先使用最前的字体来显示相应文本，如果浏览器找不到该字体，则会使用组合项第二种字体显示文本，依此类推，直到找到合适的字体为止。如果浏览器没有找到合适字体，则以默认字体显示文本。

对字符设置字体格式，实际上使用的是和标记。而设置字体，实际上定义的是标记的face属性，例如，下面的代码将“微文工作室”5个字设置为黑体：

微文工作室

如果从字体菜单项中选择“Default Fonts”（默认字体），实际上是从代码中删除了标记的face属性及其属性值。

标记带有大量的属性，限于篇幅，我们不在这里一一介绍，而只在书中相应的地方顺带做简要描述。

设置字号

字号指的是字体的大小，它没有一个绝对的大小标准，其大小只是相对于默认字体而言。例如，1号和2号字，比默认字体要小一些，而4号和5号字，比默认字体要大一些。

要在Dreamweaver中设置字符的字号，您可以按照如下方法进行操作：

1. 选中要设置字号的文字。

2. 打开“Text”（文本）菜单，选择“Size”（大小），然后选择需要的大小，您可以从1到7选择7级字号。

3. 如果希望使用默认字体大小，可以从菜单中选择“Default”（默认），这实际上是从源代码中除去了相应的字体大小设置代码。

4. 如果希望以默认字符大小为基准，设置字符相对默认字符大小的增减量，可以打开“Text”（文本）菜单，选择“Size Increase”（增加大小）或“Size Decrease”（减小大小），然后选择要增减的级别。

在HTML中，实际上用<basefont>标记来定义默认字符的大小，其默认值为3。该标记通常写在HTML的头部位置。在Dreamweaver中，并不显式地创建<basefont>标记，如果需要设置默认字体的大小，可以在HTML源代码检视器中，手工往HTML头部添加<basefont>标记。

对字号的增减设置是相对默认字符大小而言的，例如，通常默认字符大小为3号，则选择+4表示设置字号为7，选择-2表示设置字号为1。

利用属性面板也可以完成字符的字号设置，打开属性面板上用于设置字号的下拉列表，选择需要的选项即可，如图 5‑17所示。如果希望设置字符相对默认字符大小的增减量，，也可以在属性面板上同一个下拉列表中来完成，如果希望取消对字号的设置，可以选择“None”（无）。

图 5‑17 利用属性面板设置字符大小

设置字符大小的操作，实际上设置的是标记的size属性，例如，下面的第一条语句将文字大小设置为5号，第二条语句，将文字大小设置为相对默认字符增加2级字号：

微文工作室

微文工作室

在默认字符大小为3的情况下，上面两条语句显式的结果是一样的。

设置字符颜色

丰富的字符颜色毫无疑问能够极大增强文档的表现力，在Dreamweaver中，要设置字符颜色，您可以按照如下方法进行操作：

1. 选中要设置颜色的字符。

2. 打开“Text”（文本）菜单，选择“Color”（颜色），可以打开Windows标准的颜色对话框，允许您选择颜色，如图 5‑18所示。

3. 选择需要的颜色，按下“确定”按钮，确定操作。

实际上，我们不推荐采用上述方法设置字符颜色，因为利用标准的Windows颜色对话框所设置的颜色，不一定会符合Web安全色的标准，换句话说，不是所有的浏览器都能够正确显式设置的颜色。如果希望利用Web安全色来设置字符颜色，应该使用属性面板上的颜色板，方法如下：

图 5‑18 Windows下标准的颜色对话框

1. 选中要设置字符颜色的文字。

2. 在属性面板上，单击“Text Color”（文本颜色）按钮，打开如图 5‑19所示的Dreamweaver颜色版，然后选择需要的颜色；也可以直接在该按钮右方的文本框中，直接输入颜色的十六进制数值。

图 5‑19 Dreamweaver的颜色板

3. 如果希望取消颜色设置，可以单击颜色板右下角的“擦除”按钮。

注意：如果希望设置默认字符颜色，可以在Dreamweaver的页面属性对话框中设置，打开“Modify”（修改）菜单，选择“Page Properties”（页面属性）命令，或是在文档中单击鼠标右键，然后从快捷菜单中选择“Page Properties”（页面属性）命令，即可打开该对话框。

设置字符颜色的操作，实际上设置的是标记的color属性值，例如，下面的语句，将字符颜色设置为红色：

微文工作室

前面已经介绍了设置字符的字体、字号和颜色等操作，它们实际上都设置标记的相关属性。使用和标记最值得注意的是，应该尽量避免发生标记嵌套，例如，应该避免如下的情形：

微文工作室

上面的语句当然也能正确在浏览器中显示，语法上也没有错误，但是却增大了代码长度，同样也增大了浏览器载入文档页面的时间。

可以将多个嵌套的标记组合在一起，例如，上面的语句，实际上可以写成如下方式：

微文工作室

这种表达方式清晰易懂，结构紧凑，在使用标记时，应该尽量采用这种方式。

Dreamweaver会针对标记自动进行优化，如果您是在文档窗口中设置的字符格式，那么不用担心出现标记嵌套的问题。

设置字符的常规样式

字符的样式（style），有时候也称作字符的风格，指的是字符的外观显示方式，例如字符的加粗、倾斜和下划线等，利用Dreamweaver，可以很容易地设置多种字符样式，方法如下：

1. 选中要设置格式的字符。

2. 打开“Text”（文本）菜单，选择“style”（样式），打开如图 5‑20所示的菜单。

图 5‑20 字符的样式菜单

3. 选择需要的选项，即可将选中文字设置相应的字符格式，被选中的菜单项左方会带有选中标记。

4. 如果希望取消设置的字符格式，可以再次打开该菜单，选择该菜单项，清除其选中状态。

从上面的样式菜单中，您可以设置如下的字符格式：

加粗、倾斜和下划线

如果从菜单中选择“Bold”（加粗），则可以将选中的文字加粗显示。

该操作实际上是为选中的文字两端添加上和标记。例如，下面的代码就使相应的文字加粗显示：

加粗文本

如果从菜单中选择“Italic”（倾斜），则可以将选中的文字显示为倾斜格式。该操作实际上是为选中的文字两端添加上和标记。例如，下面的代码就使相应文字倾斜显示：

倾斜文本

如果从菜单中选择“Underline”（下划线），则可以在选中的文字下方显示下划线。

该操作实际上是为选中的文字两端添加上和标记。例如，下面的代码就在相应文字下方添加下划线：

下划线文本

字符的加粗、倾斜和下划线是最常用的三种字符样式，它们的显示如图 5‑21所示。可以在文字中任意组合这三种格式。

图 5‑21 字符的加粗、倾斜和下划线效果

利用属性面板可以快速设置字符的加粗或倾斜格式，单击属性面板上的相应按钮即可，如图 5‑22所示。如果要取消加粗或倾斜格式，可以再次单击该按钮，使按钮弹起。

另外一种快速设置加粗或倾斜的方法是使用快捷键，按下Ctrl+B组合键，可以使选中文本被加粗；按下Ctrl+I组合键，可以使选中文本被倾斜；再次按下相应的快捷键，则又可以取消加粗或倾斜格式。

图 5‑22 属性面板上的加粗和倾斜按钮

删除线

如果从文本样式菜单上，选择“Strikethrough”（删除线）按钮，则在选中文字中部横贯一条线，表明文字被删除。

该操作实际上是为选中文字两端添加上<s>和</s>标记，例如，下面的语句在相应文字上添加删除线。

<s>删除的文字</s>

该代码会显示如图 5‑23所示的效果。

图 5‑23 在文字上添加删除线

使用<del>和</del>标记也可以实现文本的删除线效果，但是有些浏览器不支持它，所以应该尽量使用<s>和</s>标记。

也可以用<strike>和</strike>标记来替代<s>和</s>标记，它们的含义是一样的。

电传打字

如果从文本样式菜单中选择“Teletype”（电传打字），则会将选中的文本作为等宽度文本来显示。所谓等宽度字体，指的是每个字符或字母的宽度相同。

该操作实际上是为选中的文本两端添加上<tt>和</tt>标记。例如，下面的代码就将相应文字以等宽度字体显示：

<tt>This is my book, that is his book, our books are very good.</tt>

在图 5‑24中显示了文字的等宽度和不等宽度显示的区别，第一行文字设置的是Arial字体，这是一种不等宽度字体，第二行文字则是等宽度显示的文字，您可以看到它们之间的区别。

图 5‑24 文字的等宽度显示

对于等宽度字体，具体设置成什么字体，这是由浏览器本身决定的，对于中文环境下的大多数的浏览器来说，会以Courier New字体作为默认的英文等宽度字体，以宋体作为默认的中文等宽度字体。

强调

如果从文本样式菜单中选择“Emphasis”（强调）命令，则表明选中的文字需要在文档中被强调，具体显示为什么格式，不同的浏览器有不同的规定，大多数浏览器把它显示为斜体。

该操作实际上是为选中的文本两端添加上和标记，例如，下面的代码就使相应的文本被强调显示：

强调的文字

强壮

如果从文本样式菜单中选择“Strong”（强壮）命令，则表明选中的文字需要在文档中以强壮的格式显示，具体显示为什么格式，不同的浏览器有不同的规定，大多数浏览器把它显示为加粗方式。

该操作实际上是为选中的文本两端添加上和标记，例如，下面的代码就使相应的文本被强调显示：

强壮的文字

代码，参数，示例和键盘输入

如果从文本的样式菜单中选择“Code”（代码），则表明文档被选中的文字是代码。具体的格式通常由浏览器决定，大多数浏览器将之显示为等宽度字体。

该操作实际上是对选中文字两端添加上<code>和</code>标记。一般来说，将之同预格式化标记<pre>和</pre>一同使用，这样可以正确显示代码中的空格。例如，下面的语句表明其中的文字是程序代码：

<code>

<pre>

class Object

{

Object();

~Object();

...

}

</pre>

</code>

如果从文本的样式菜单中选择“Variable”（参数），则表明文档被选中的文字是参数。具体的格式通常由浏览器决定，大多数浏览器将之显示为斜体。

该操作实际上是对选中文字两端添加上<var>和</var>标记。例如，下面的语句表明其中的文字bIsEnable是程序代码中的参数，它定义了一个布尔变量：

<code>BOOL <var>bIsEnable</var>;</code>

如果从文本的样式菜单中选择“Sample”（示例），则表明文档被选中的文字是一个程序示例。具体的格式通常由浏览器决定，大多数浏览器将之显示为等宽度字体。

该操作实际上是对选中文字两端添加上<samp>和</samp>标记。通常和预格式化标记<pre>和</pre>一起使用，以使其中的空格正确显示。例如，下面的语句表明其中的文字一段程序示例：

<samp>

<pre>

#include <studio.h>

main()

{

printf("Hello, World.\n");

}

</pre>

</samp>

如果从文本的样式菜单中选择“Keyboard”（键盘输入），则表明文档被选中的文字是需要用户输入的。具体的格式通常由浏览器决定，大多数浏览器将之显示为等宽度字体。

该操作实际上是对选中文字两端添加上<kbd>和</kbd>标记。一般来说，将之同预格式化标记<pre>和</pre>一同使用，这样可以正确显示代码中的空格。例如，下面的语句表明其中的文字是需要用户输入的：

您需要输入如下内容：

<kbd>

<pre>

#include <studio.h>

main()

{

printf("Hello, World.\n");

}

</pre>

</kbd>

引用和定义

如果从文本的样式菜单中选择“Citation”（引用），表明选中的文字是被引用的。具体的格式通常由浏览器决定，大多数浏览器将之显示为斜体格式。

该操作实际上是对选中的文本两端添加上<cite>和</cite>标记。例如，下面的代码就使用了该标记：

马克思说：<cite>全世界无产者，联合起来。</cite>

如果从文本的样式菜单中选择“Definition”（定义），表明选中的文字是一个定义。具体的格式通常由浏览器决定，大多数浏览器将之显示为斜体格式。

该操作实际上是对选中的文本两端添加上<dfn>和</dfn>标记。例如，下面的代码就使用了该标记：

喷嚏：<dfn>鼻粘膜受到刺激而产生的一种猛烈的发力喷气出声现象。</dfn>

有些浏览器（如Netscape Navigator）不能识别定义和引用标记，所以为了保险，可以在相应标记之外再添加斜体标记和，使之在所有的浏览器上都能正确显示。

设置项目列表

前面大致介绍了如何在Dreamweaver中设置段落格式和字符格式，实际上，我们还遗漏了一个很重要的格式设置方法，就使设置段落的项目列表。

列表在很多文档中都可以看到，例如，需要列举一些具有相同属性的事物，或是像本书一样，需要介绍某个操作的步骤，都会用到项目列表。

在HTML中，有两种类型的项目列表，一种是无序项目列表，一种是有序项目列表，前者用于用项目符号来标记项目无序的项目，而后者则使用编号来记录项目的顺序。

在Dreamweaver中，允许您设置多种项目列表格式。

理解项目列表的类型

在HTML中，可以创建如下的几种列表：

l 无序列表

l 有序列表

l 定义列表

l 目录列表

l 菜单列表

下面分别对这几种列表进行解释。

无序列表

在无序列表中，各个列表项之间没有顺序级别之分，它通常使用一个项目符号作为每条列表项的前缀。在HTML中，有三种类型的项目符号：球形、环形和矩形。图 5‑25显示了这几种不同的项目符号。

图 5‑25 几种不同的项目符号

HTML中采用如下的语法结构来描述无序列表：

<ul>

<li>第一列表项</li>

<li>第二列表项</li>

...

</ul>

通过设置<ul>标记的type属性，可以决定无序项目列表的项目符号类型，下面是三种属性值的含义：

type = "disc" 使用球形的项目符号

type = "circle" 使用环形项目符号

type = "square" 使用矩形项目符号

如果我们希望编写图 5‑25中采用球形项目符号的项目列表，可以使用如下代码：

<li>吸烟导致死亡</li>

<li>酗酒导致死亡</li>

<li>焦虑导致死亡</li>

<li>逸乐导致死亡</li>

</ul>

<li>标记同样带有type属性，如果为列表中的某个<li>标记设置type属性，将会从该<li>标记所在行起使用新的项目符号。

有序列表

有序列表同无序列表的区别在于，它使用编号，而不是项目符号来编排项目。它的HTML语法结构如下所示：

<ol>

<li>第一列表项</li>

<li>第二列表项</li>

...

</ol>

对于有序编号，可以指定其编号类型和起始编号，图 5‑26显示了采用数字和大写字母作为项目编号的情形。

图 5‑26 采用不同的项目编号

<ol>标记带有type、start等属性，用于设置编号类型和起始编号。

通过设置type属性，可以指定数字编号类型，下面是每个属性值的含义：

type = "1" 以阿拉伯数字作编号

type = "a" 以小写字母作为编号

type = "A" 以大写字母作为编号

type = "i" 以小写罗马数字作为编号

type = "I" 以大写罗马数字作为编号

通过设置<ol>标记的start属性，可以决定编号的起始值。对于不同类型的编号，浏览器会自行计算相应的起始值。例如，start = "3"，表明对于阿拉伯编号，从3开始；对于小写字母编号，从c开始；对于大写字母编号，从C开始，依此类推。

对于图 5‑26左边所示的例子，可以使用如下的代码：

<li>将锅中的油加热</li>

<li>放入打散的鸡蛋，进行翻炒。</li>

<li>炒至将熟时，放入适当的味精和盐。</li>

<li>继续翻炒，至熟时出锅。</li>

</ol>

其中，因为默认时使用数字编号，且起始值为1，因此可以省略其中对type和start属性的设置。

<li>标记同样带有type和start属性，如果为列表中的某个<li>标记设置type属性，将会从该<li>标记所在行起使用新的编号类型；如果为列表中的某个<li>标记设置start属性，将会从该<li>标记所在行起使用新的起始编号。

定义列表

定义列表也称作字典列表，因为它同字典具有相同的格式。在定义列表中，每个列表项带有一个缩进的定义字段，就好像字典对文字进行解释一样。

图 5‑27显示了一个定义列表的例子。

图 5‑27 定义列表

在HTML中，定义列表采用如下的语法结构：

<dl>

<dt>第一标题项</dt>

...

<dt>第二标题项</dt>

...

</dl>

对于图 5‑27所示的定义列表，对应是如下代码：

<dl>

<dd>World Wide Wait，世界范围的等待。</dd>

<dd>Plug and Pray，插入然后祈祷。</dd>

</dl>

目录列表和菜单列表

目录列表通常用于设计一个压缩窄列的列表，用于显示一系列的列表内容，例如字典中的索引或单词表中的单词等。列表中每项至多只能有20个字符。

目录列表的HTML语法结构如下所示：

<dir>

<li>第一列表项</li>

<li>第二列表项</li>

...

</dir>

菜单列表通常用于设计单列的菜单列表。其语法结构如下所示：

<menu>

<li>第一列表项</li>

<li>第二列表项</li>

...

</menu>

一般来说，不建议使用目录列表和菜单列表的形式，而应该用标准的无序列表替换它们。

创建项目列表

在Dreamweaver中，您可以在输入文字时创建项目列表，也可以将现有段落转换为项目列表。

创建新项目列表

要在Dreamweaver中创建新项目列表，您可以按照如下方法进行操作：

1. 首先输入项目列表的第一行，将插入点放置到该行中。

2. 打开“Text”（文本）菜单，选择“List”（列表），打开如图 5‑28所示的菜单。

图 5‑28 文本的列表菜单

3. 要创建无序的项目列表，可以选择“Unordered List”（无序列表）命令；要创建有序的项目列表，可以选择“Ordered List”（有序列表）命令；要创建定义列表，可以选择“Definition List”（定义列表）命令。

4. 在第一行后面回车，继续输入项目中的其他内容，这时您会看到，项目前会出现相应的项目符号或编号。

5. 如果希望结束项目列表，可以在最后一行后连续按下两次回车。

图 5‑29显示了无序项目列表和有序项目列表的外观。

图 5‑29 无序项目列表和有序项目列表

使用属性面板上的项目列表按钮，如图 5‑30所示，也可以很容易地创建新项目列表，单击相应的按钮，即可从插入点所在位置开始，创建项目列表。

图 5‑30 属性面板上的项目列表按钮

将现有段落转换为项目列表

如果希望将现有的段落文字转换为项目列表，您可以按照如下方法进行操作：

1. 选中要转换为项目列表的所有段落。

2. 打开“Text”（文本）菜单，选择“List”（列表），再选择相应的“Unordered List”（无序列表）、“Ordered List”（有序列表）菜单项或“Definition List”（定义列表）菜单项。

3. 这时选中的段落文字就被转换为项目列表的形式。如果打开源代码检视器，您就会看到，相应的项目标记替换了段落标记和。

使用属性面板上的项目列表按钮，如图 5‑30所示，也可以很容易地将当前已有的段落文字转换为项目列表，单击相应的按钮，即可将选中的段落文字设置为项目列表的形式。

嵌套项目列表

项目列表可以进行嵌套，以实现多级项目列表的形式。要创建项目列表嵌套，您可以按照如下方法进行操作：

1. 将插入点放置到项目列表希望嵌套入更深级别的行中，如果有多行希望嵌套，可以选中这些行。

2. 打开“Text”（文本）菜单，选择“Indent”（缩进），或是单击属性面板上的“缩进”按钮，即可看到，项目被嵌套了。

3. 如果希望将更深级别的项目列表提高级别，可以选中这些行，然后打开“Text”（文本）菜单，选择“Outdent”（反缩进），或是单击属性面板上的“反缩进”按钮。

图 5‑31显示了项目列表的嵌套情形。

图 5‑31 项目列表的嵌套

设置项目列表属性

通过设置项目列表的属性，可以决定项目列表的类型，无序项目列表中项目符号的类型，或有序项目列表中项目编号的类型等设置。

您可以按照如下步骤进行操作：

1. 将插入点设置到要设置属性的项目列表中任意位置。

2. 打开“Text”（文本）菜单，选择“List”（列表），再选择“Properties”（属性）命令，这时会打开如图 5‑32所示的对话框。

图 5‑32 列表属性对话框

3. 在“List Type”（列表类型）下拉列表框中，可以选择列表类型。该选择将影响插入点所在位置的整个项目列表的类型。通常有如下四种选择：

l Bulleted List（符号列表）生成的是带有项目符号式样的无序列表。实际上就是使用<ul>和</ul>标记来定义列表。

l Numbered List（编号列表）生成的是有序列表。实际上就是使用<ol>和</ol>标记来定义列表。

l Directory List（目录列表）生成目录列表，用于编排目录。实际上就是使用<dir>和</dir>标记来定义列表。

l Menu List（菜单列表）生成菜单列表，用于编排菜单。实际上就是使用<menu>和</menu>标记来定义列表。

4. 在“Style”（样式）下拉列表中，可以选择相应的项目列表样式。该选择将影响插入点所在位置的整个项目列表的样式。

l 如果前面选中的是“Bulleted List”（符号列表），则这里可以选择项目列表的符号类型。

u 如果选择“Bulleted”（球型），将以球形作为无序列表的项目符号，该操作实际上是将<ul>标记的type属性值设置为disc。

u 如果选择“Circle”（环形），将以一个空心圆作为无序列表的符号，该操作实际上是将<ul>标记的type属性值设置为circle。

u 如果选择“Square”（矩形），将以一个实心矩形作为无序列表的符号，该操作实际上是将<ul>标记的type属性值设置为square。

l 如果前面选中的是“Numbered List”（编号列表），则这里可以选择编号的数字格式。

u 如果选择“Number”（数字），则以阿拉伯数字作为有序列表的编号字符。该操作实际上是将<ol>标记的type属性值设置为1。

u 如果选择“Roman Small”（小写罗马数字），则以小写罗马数字作为有序列表的编号字符。该操作实际上是将<ol>标记的type属性值设置为i。

u 如果选择“Roman Large”（大写罗马数字），则以大写罗马数字作为有序列表的编号字符。该操作实际上是将<ol>标记的type属性值设置为I。

u 如果选择“Alphabet Small”（小写字母），则以小写英文字母作为有序列表的编号字符。该操作实际上是将<ol>标记的type属性值设置为a。

u 如果选择“Alphabet Large”（大写字母），则以大写英文字母作为有序列表的编号字符。该操作实际上是将<ol>标记的type属性值设置为A。

l 如果前面选中的是“Directory List”（目录列表）或“Menu List”（菜单列表），则这里无需输入。

5. 如果前面选择的是“Numbered List”（编号列表），则在“Start Count”（开始编号）文本框中，可以选择有序编号的起始数字。该选择将使插入点所在位置的整个项目列表的第一行开始重新编号。该操作实际上是设置<ol>标记的start属性值。

6. 在“New Style”（新样式）下拉列表中，允许您在项目列表中的列表项指定新的样式，这时从插入点所在行及其以后行开始都会使用新的项目列表样式。该操作实际上是设置相应<li>标记的type属性。

7. 如果前面选择的是“Numbered List”（编号列表），在“Reset Count”文本框中，可以输入新的编号起始数字。这时从插入点所在行开始的以后各行，会从新数字开始编号。该操作实际上是设置相应<li>标记的start属性。

8. 设置完毕，按下“OK”按钮，确定操作。

注意：也可以通过单击属性面板上的“List Item”（列表项）按钮来打开该列表属性对话框，要注意的是，必须展开属性面板，才可以看到该按钮。

使用HTML样式格式化文本

前面介绍了如何设置文本的段落格式和字符格式，实际上Dreamweaver中还提供了一个更为科学的方法，帮助您进行文本格式的设置，这就使HTML样式。

HTML样式实际上是一系列HTML格式化标记的组合，用于一次对文本对象进行多个方面的格式设置。例如，如果希望将文字设置为黑体、4号、加粗、倾斜、红色格式，按照传统的方法必须分别进行5次格式化设置。如果利用Dreamweaver的HTML样式功能，将这5次格式化操作组合成一个HTML样式，并以适当的名字命名，下次当需要对文本应用这些格式时，只需要一步操作——应用该HTML样式——就可以了。

同CSS不同，应用HTML样式的操作不是自动化的，换句话说，如果您对某些文字应用了一个定义的HTML样式，当您改变该HTML样式所代表的格式时，原先已经设置格式的文字格式并不会变化。

显示HTML样式面板

在Dreamweaver中，HTML样式相关操作都是在HTML样式面板中完成的。您可以使用下面的方法打开HTML样式面板：

方法一：

打开“Window”菜单，选择“HTML Styles”（HTML样式）。

方法二：

单击启动面板上的“HTML Styles”（HTML样式）按钮，如图 5‑33所示。

方法三：

按下Ctrl+F7组合键。

一个典型的HTML样式面板如图 5‑34所示。

图 5‑33 从启动面板上显示HTML样式面板

图 5‑34 HTML样式面板

单击HTML样式面板右上角的显示菜单按钮，可以打开如图 5‑35所示的面板菜单；在面板中单击鼠标右键，也可以打开一个结构一样的快捷菜单。很多操作也可以通过该面板菜单来完成。

图 5‑35 HTML样式面板菜单

理解样式列表

在HTML样式面板中，默认状态下已经有许多定义的样式。每条样式项后面都带有相应的文字，用于说明该样式进行的是哪些格式化操作。

正如我们前面介绍过的，对文本的格式设置包括设置段落格式和设置字符格式两个方面，HTML样式也包括段落样式和字符样式两种。根据HTML样式面板的列表中相应的样式标记，我们可以判断这些样式的类别：以段落标记开头的样式，表明它是一个段落样式；以字符a开头的标记，表明它是一个字符样式，如图 5‑36所示。

图 5‑36 样式列表中的标记

当HTML样式应用到文本上时，会出现两种情况，一种情况是清除原先已有的格式，然后应用新的格式，这种样式称作覆盖型样式；另一种情况是保留原先已有的格式，然后添加新的格式，这种样式称作添加型样式。从样式列表中，我们同样可以判断这种样式类型，如果样式项前面的标记后带有“＋”号，则表明它是添加型样式，否则，表明它是覆盖型样式。如图 5‑36所示。

注意：在样式列表中，前两项“Clear Selection Style”（清除选择内容样式）和“Clear Paragraph Style”（清除段落样式）并不是真正的样式，它们是两种行为，分别用于清除当前选中文本或段落的样式。

应用HTML样式

包括如果希望在文档中应用样式，您可以按照如下方法进行操作：

1. 如果要设置段落格式，可以将插入点放置于段落之中；如果要设置多个段落的格式，则需要选中这些段落；如果要设置字符格式，则需要选中这些字符。

2. 在HTML样式面板中，选择某个样式。

3. 如果选中了“Auto Apply”（自动应用）复选框，则自动对相应的文本应用选中的样式。

4. 如果没有选中“Auto Apply”（自动应用）复选框，则可以单击“Apply”（应用）按钮，应用样式；也可以打开面板菜单，然后选择“Apply”（应用）命令。

注意：

如果希望清除当前选中文本的字符样式，可以从样式列表中选择“Clear Selection Style”（清除选择内容样式），然后应用该该样式。

如果希望清除当前插入点所在段落或选中的多个段落的样式，可以从样式列表中选择“Clear Paragraph Style”（清除段落样式），然后应用该样式。

采用上面的方法可以清除以任何方式设置的格式，无论该格式是手工从HTML源代码检视器中设置的格式，是在文档窗口中用标准HTML标记设置的格式，还是在HTML样式面板中应用的HTML样式。

创建新样式

如果希望创建新样式，您可以按照如下步骤进行操作：

1. 单击HTML样式面板上的“New Style”（新建样式）按钮，或打开面板菜单，选择“New”（新建），这时会出现如图 5‑37所示的对话框。

图 5‑37 新建HTML样式

2. 在“Name”（名称）文本框中，输入样式的名称，该名称最好清晰易懂，以便在应用样式时知道该样式到底执行的是哪些格式化操作。

3. 在“Apply To”（应用到）区域，可以设置样式是段落样式还是字符样式。

l 选中“Selections”（选择内容），表明新建的样式是字符样式。

l 选中“Paragraph”（段落），表明新建样式是段落样式。

4. 在“When Applying”（应用时）区域，允许您设置当应用该样式时，是覆盖原先已有格式，还是在原先已有格式上添加新格式。

l 选择“Add to Existing Styles”（添加到已有样式），则应用样式时在原先已有格式基础上添加新格式。

l 选择“Add to Existing Styles”（清除已有样式），则应用样式时先清除原有的格式，再设置新格式。

5. 在“Font Properties”（字体属性）区域，允许您设置相应的字符格式。

l 在“Font”（字体）下拉列表中，可以选择要使用的字体。

l 在“Size”（大小）下拉列表中，可以选择字号。

l 单击“Color”（颜色）按钮可以打开Dreamweaver的颜色板，允许您选择文本的颜色，您也可以在右方的文本框中直接输入颜色的十六进制数值。

l 在“Style”（样式）区域，可以设置字符的常规样式，例如加粗和倾斜等，单击“Other”按钮，可以打开一个菜单，允许您指定其他字符格式，如“电传打字”、“删除线”等。

6. 在“Paragraph Properties”（段落属性）区域，允许您设置相应的段落格式：

l 在“Format”（格式）下拉列表中，可以选择相应的段落格式，如标题1、标题2等。

l 在“Alignment”（对齐）区域，单击相应的按钮，可以设置段落对齐方式。

7. 单击对话框上的“Clear”（清除）按钮，可以清除所有选项，重新设置。

8. 单击“OK”按钮，可以确定操作，保存设置，这时新建的样式名称就出现在HTML样式面板的样式列表中。

编辑现有样式

您也可以对样式列表中现有的样式进行修改，方法如下：

1. 在样式列表中选择要编辑的样式。

2. 单击HTML样式面板右上角的显示菜单按钮，打开如图 5‑35所示的面板菜单；或是在面板中单击鼠标右键，打开快捷菜单。

3. 从菜单中选择“Edit”（编辑），这时会打开同图 5‑37结构一样的对话框，并显示该样式的设置。

4. 在对话框中进行相应的修改，修改完毕，按下“OK”按钮，确定操作。

在现有样式的基础上创建新样式

如果希望在某个现有样式的基础上创建新样式，可以先复制该样式，然后再进行修改。您可以按照如下方法进行操作：

1. 在HTML样式面板中，选中作为基础的样式。

2. 单击HTML样式面板右上角的显示菜单按钮，打开如图 5‑35所示的面板菜单；或是在面板中单击鼠标右键，打开快捷菜单。

3. 选择“Duplicate”（复制）命令，这时会立刻打开一个同图 5‑37结构一样的对话框，并显示该样式的设置。

4. 进行必要的修改，然后输入新的名称。

5. 按下“OK”按钮，确定操作。

删除样式

如果希望删除某个样式，您可以按照如下步骤进行操作：

1. 在HTML样式面板中，选中要删除的样式。

2. 单击HTML样式面板右下角的“Delete Style”（删除样式）按钮，或是从面板菜单中选择“Delete”命令。

3. 这时样式即被删除，同时从样式列表中消失。

拼写检查

在Dreamweaver中，对文档中的英文内容提供简单的拼写检查功能，能够帮助您超出单词的拼写错误。

您可以按照如下方法进行操作：

1. 打开“Text”（文本）菜单，选择“Check Spelling”（检查拼写）命令，或是按下Shift+F7组合键，即可对文档进行拼写检查。

2. 如果文档中存在出错单词，则会出现如图 5‑38所示的对话框，提示您选择正确的单词拼写。

图 5‑38 拼写检查

3. 在“Word not found in dictionary”（未在字典中找到的单词）文本框中，显示当前文档中查找到的可能存在拼写错误的单词。

4. 在“Suggestion”（建议）列表框中，显示可能正确的几种单词拼写。

5. 在“Change To”（改变为）文本框中，显示Dreamweaver建议将该单词修改为什么单词，您也可以通过在“Suggestion”（建议）列表框中选择其他单词，或是自行在该文本框中输入修正后的单词。

6. 要修正出现拼写错误的单词，可以按下“Change”（改变）按钮，这时当前的单词就被修改为“Change To”（改变为）文本框中的单词。如果希望对文档中所有的该单词都进行修正，可以按下“Change All”（改变全部）按钮。

7. 如果希望忽略该可能存在拼写错误的单词，不对之进行修正，可以按下“Ignore”（忽略）按钮，如果希望忽略文档中所有该单词，不再检查其拼写，可以按下“Ignore All”（忽略全部）按钮。

8. 如果您认为该单词实际上是正确的，只是Dreamweaver的字典不够大，则可以单击“Add to Personal”（添加到个人字典）按钮，将之添加到个人字典中，以后Dreamweaver再遇到该单词，就不会再认为它可能存在拼写错误。如果您希望对个人字典进行修改，可以利用普通的文本编辑器来修改Dreamweaver目录中的Personal.dat文件。

注意：通过打开“Edit”（编辑）菜单，选择“Preferences”（参数选择）命令，打开Dreamweaver的参数选择对话框，然后从左方的目录列表中选择“General”（常规），然后从右方的“Dictionary”（字典）下拉列表中，可以选择当前使用哪种英语字典作为拼写检查的字典。

第一章

第二章

第三章

第四章

第五章

第五章 格式化文本

文本格式化操作概述

格式化文本的三种方式

理解段落和字符

段落

字符

对段落或字符的格式化

使用HTML标记格式化文本

设置段落格式

定义段落

设置标题

定义预格式化文本

对齐段落

缩进段落

控制断行

设置字符格式

设置字体

设置字号

设置字符颜色

设置字符的常规样式

设置项目列表

理解项目列表的类型

无序列表

有序列表

定义列表

目录列表和菜单列表

创建项目列表

创建新项目列表

将现有段落转换为项目列表

嵌套项目列表

设置项目列表属性

使用HTML样式格式化文本

显示HTML样式面板

理解样式列表

应用HTML样式

创建新样式

编辑现有样式

在现有样式的基础上创建新样式

删除样式

拼写检查

第五章格式化文本