网页的编辑与控制.doc

第三章 网页的编辑与控制3.1利用Dreamweaver 8编辑网页文本图3-1是一个简单的网页示例，下面结合该网页介绍网页文本的处理方法。图3-1 网页示例3.1.1在网页中添加和处理文本1输入文字首先启动Dreamweaver 8，打开一个网页。将光标放在页面编辑区内，按照页面的要求输入文字，为了使网页布局合理，将十二星座放在一个1行4列的表格中（表格处理的方法参见本书第4章）。如图3-2所示。如果有现成的.doc或.txt文件，可另存为.htm文件，再利用Dreamweaver 8打开即可。也可以用复制粘贴的方法把其他需要的内容复制过来。在复制文本时常常用到以下几种操作。（1）换行 自动换行：再输入文字时，若是一行的长度超过了Dreamweaver 8窗口的显示范围，文字将自动换到下一行。自动换行的好处在于不管浏览器的大小。网页文字都见按照窗口大小自动换行，避免超出页面之外而要通过移动滚动条浏览情况。 利用Ctrl+Shift键换行再输入文字后按键，文字成段，且上下段空一行。 利用Shift+Enter键换行：如果需要将文字手动换行，中间又不能出现空行，可以按Shift+Enter键。图3-2 输入文本的页面（2）输入空格Dreamweaver 8中，在文本开始处按空格键是不会输入空格的，在文字之间按空格键可以输入半个空格。如果要在网页中输入空格，可以采用以下3种方法。 按住Ctrl+Shift键，按一次空格键，键入半个空格。 将输入法有半角切换到全角状态（如图3-3所示），按一次空格键，键入一个空格。图3-3 半角状态与全角状态的切换 将编辑窗口切换到代码视图，再要输入空格的地方输入 ；输入一组代码 ，产生半个空格。（3）插入特殊的字符有时为了内容的需要，要在 Dreamweaver 8网页中插入一些键盘上没有的特殊字符。在中，这些字符不仅可以通过“插入”菜单下的“特殊字符”命令来插入，还可以通过插入“字符”面板直接插入。单击插入“字符”面板上所要插入的特殊字符的按钮，即可插入字符。如果插入“字符”面板中找不到的字符，还可以单击面板右边的按钮，弹出“插入其它字符”对话框，图3-4所示，在其中有更多的字符可供选择。图3-4 “插入其他字符”对话框（4）加入注释文字在网页中加入适当的注释文字，可以为日后修改，管理网页提供方便。由于注释只有在编辑网页时或查看源代码时才能看到，所以不必担心注释文字会破坏版面。将光标移到想要插入注释的地方，然后单击插入面板上“常用” 选项中的注释按钮，或“插入”“文本对象”“注释”命令，弹出对话框，如图3-5所示。在对话框加入批注内容，单击“确定”按钮即可。图3-5 “注释”对话框这时如果主窗口工作区处于显示设计视图，则在插入注释看到一个小标志。单击这个小标志，就会发现“属性”面板上立即出现了注释编辑框。可以在注释编辑框中修改批注内容。通过“查看”“代码”，将工作区状态转到显示代码视图，就可可以清楚看到批注。当然可以选择“查看” “代码和设计”命令将两者联系起来看。（5）插入水平线在页面中插入水平线的方法如下。首先确定插入水平线的位置，然后单击面板上“HTML”选项中的按钮，或选择“ 插入”“HTML” “水平线”菜单命令，则可在面板中插入一条水平线。选中水平线，打开图3-6的水平线属性面板，可以设置水平线的属性。图3-6 水平线属性面板在水平线属性面板上，“宽”和“高”用来设置水平线的宽度和高度（有像素和百分比两种单位）；用来设置水平线的对齐方式；“阴影”选项用于设置水平线的显示方式，勾选择该项表示有阴影，否则无阴影。（6）插入日期和时间在网页中插入日期和时间如下。1.确定插入日期和时间的位置（一般位于页面底部）。2.单击插入面板上“常用”选项卡的按钮，或“插入”“日期”菜单命令，打开“插入日期”对话框，如图3-7所示。图 3-7 “插入日期”对话框3.在“插入日期”对话框中选择“日期和时间”的格式，如果要自动更新，则勾选“存储时自动更新”选项。4.单击“确定”按钮，完成日期和时间的插入。日期和时间的格式和普通字符的格式一样进行设置，即选中包含日期和时间在内的文字，在文本属性中设置。按照以上方法插入日期和时间，如图3-8 所示。图3-82编辑文本（1）设置标题文字选中的一行的“星座传说”，打开属性面板，属性面板上各项的含义如下如图3-9所示。3-9 文本的属性面板在“格式”下拉表框中选中标题文字，这里选中“标题2”。单击按钮是文字变粗，但按钮使文字居中。（2）添加和删除中文字体在Dreamweaver 8中，默认状态可供选择的字体很少，要要使用某些中文字体可以事先将计算机里的中文字体添加到Dreamweaver 8的字体列表中。具体步骤如下。在主窗口的菜单栏中选择“文本”“字体”“编辑字体列表”命令，弹出如图3-10 所示的“编辑字体列表”对话框。图3-10 “编辑字体列表”对话框从对话框的“可用字体”框中，选择需要的字体，然后单击按钮，这种字体就会添加到“字体”列表框中选择所需的字体，然后单击按钮，这种字体就会添加到“字体列表”中。单击“确定”按钮，就可以将这种字体添加到字体列表中了。需要说明的是，如果需要添加多种字体，一定要重复不断-的步骤，千万不能图省事。在“可选字体”框中不断选择字体，通过单击按钮，不断添加到“字体”列表框中，最后打击“确定”键 , 这样只有第一种子字体是有效的，后面的字体不起作用。 也可以先单击左上角按钮，在选择字体，然后单击按钮，这种方法更有效且更快捷。在添加字体对话框中，按钮用来添加字体，按钮是用来将在“字体列表”中选定字体删除。(3)设置字体的颜色选择文本，在属性面板中的字体颜色对话框中输入颜色设置的十六种颜色代码，或单击文本颜色按钮，打开颜色编辑面板，如图3-11所示。用吸取需要的颜色即可。图3-11 通过属性面板改变文本颜色如果想在更大范围选择颜色，可执行“文本”“颜色”命令，打开颜色对话框来选择颜色，如图3-12所示。图3-12 颜色对话框（4）添加项目符号和项目编号选择表格的十二星座，单击项目列表按钮，则在文字前添加了小圆点项目符号。如果单击编辑列表按钮，则在选择的段落前添加了项目编号。在编辑文本时，除了常用上述操作外，还经常用到“编辑” “查找/替换”文本的内容，方法如下。在Dreamweaver 8编辑窗口，选择“编辑”“查找/替换”命令，打开“查找/替换”对话框 ，如图3-13所示。图3-13 “查找/替换”对话框 在“查找在”栏中，可以通过单击其右侧的来选择 Dreamweaver 8提供的4种不同的查找和替换范围：当前文档，整个当前本地站点，站点中选择文件和文件夹。在“查找范围”栏中，可以单击其右侧的来选择Dreamweaver 8提供的4种不同的查找和替换方式:源代码，文本，文本（高级）来指定标签。完成相关设置以后，单击“查找全部”或“替换全部”按钮，可以完成查找或替换。利用这些功能可以轻松完成在各种复杂条件下的查找和替换。3.1.2在网页中添加图像确定网页中图像的位置，选择“插入”“图像”菜单命令，打开图3-14所示的“选择图像源文件”对话框，选择要插入的图像，单击“确认”按钮 。有关网页图像的处理，详见本书。图3-14 “选择图像源”对话框根据要求编辑整网页文本，使页面如图3-3所示，保存网页，文件名为xingzuochuangqi.htm，预览网页，观察显示效果。3.2 HTML概述3.2.1什么是HTMLHTML是一种专门用于Web页制作的编程语言,用来描述超文本各个部分的内容,告诉浏览器如何显示文本,怎样生成与别的文本或图像的链接点。一名网页设计高手，就必需掌握HTML。HTML是网络的通用语言，它允许设计者建立文本与图像相结合的复杂页面，这些页面可以被网上任何人浏览，无论使用的是什么类型的电脑或浏览器。用HTML编者按写的文件将保存成.htm或.html文件,浏览器通过解释执行HTML编码。一个HTML文件中饮食了所有将显示在网页上的文字信息,其中也包括对浏览器的一些指示,如某些文字应放置在何处,文字的显示模式等。如果还有一些图片、动画、声音或是任何其他形式的资源，HTML文件也会告诉浏览器到何处去查找这些资源，以及这些资源将放置在网页的什么位置，HTML文件通过标记符来实现这一功能。HTML作为一种网页编辑语言，易学易懂，能制作出精美的网页效果，其他的专用网页编辑器（如FrontPage、Dreamweaver 8）都是以HTML为基础的。图3-1所示网页的HTML代码如下：无标题文档星座传说早在公元世纪，古希腊天文学家就把当地能够观察到的南天星空划分 为个星座，并用丰富的想象力把这些星座的形状与希腊神话联系起来。 当时的天文学家将星座中的主要亮星用假想的线条连接起来，形成希腊神话 的人物、动物或器物的形象，然后再用他们的名字命名相应星座的名称。这就是星座的由来。 白羊座 巨蟹座 天秤座 摩羯座 金牛座 狮子座 天蝎座 水瓶座 双子座 处女座 射手座 双鱼座 本网页制作于2007年4月30日 星期一 9:36 PM 3.2.2标记符及其属性标记符是HTML的基本元素，一个HTML文件大部分都是由字符信息加上一些标记符呈现出来的。因此，在介绍利用HTML处理文本之前，首先介绍标记符以及一些与网页设计相关的基础知识。1标记符标记符又称标签，HTML是影响网页内容显示格式的标记符集合，浏览器根据标记决定网页的实际显示效果。HTML的语法比较简单，即使没有任何计算机语言基础也很容易学。在HTML中，所有的标记符都用尖括号括起来。例如，表示HTML标记符。在HTML中，有些标记符，例如换行标记符，只要求单一标记符号，但绝大多数标记符都是成对出现的，包括开始标记符和结束标记符。开始标记符和相应的结束标记符定义了标记符所影响的范围。结束标记符与开始标记符的区别是在名称前多一个斜线。如：；等。HTML标记符是不区分大小写的，但通常约定标记符使用大写字母，这有利于HTML文档的维护。为了对标记符作用的内容进行更详细的控制，大多数标记符都具有一些属性。实际上，标记符只是规定这是什么信息，是文本或是图片，但怎么显示或控制这些信息，就需要在标记符后面加上相关的属性来表示。2属性属性是用来描述对象特征的特性。在HTML中，所有的属性都放置在开始标记符的尖括号里，属性与标记符之间用空格分隔，属性的值放在相应属性之后，用等号分隔，而不同的属性之间用空格分隔。格式为：受影响的内容HTML属性通常也不区分大小写。本书中为了区分标记符及其属性，标记符均使用大写字母表示，而属性均使用小写字母表示。3.2.3HTML文件的基本结构HTML文档必须以标记符开始,并以标记符结束,其他的标记符都必须在该标记符里面.在这两个标记符之间,HTML文件被分为首部（HEAD）和体部（BODY）两大部分，如同一个邮件信息。首部用来确定文本的标题（TITLE）和其他有关文本的信息，体部的文本被结构化为段落、列表等，并可创建与其他地址的联系等。一个典型的HTML文本的基本结构形式如下。文本标题文本内容上述文档用到4种标记符，其意义如下。（1）HTML标记符HTML/HTML这两个标记符是HTML文档的标记符。HTML处于文档的最前端，表示文档的开始，即浏览器从HTML开始解释。而/HTML则位于文件的最后一行，表示这一行文档都是HTML语法的文档。（2）HEAD标记符HTML/HTML是HTML文件头标记符，用来描述HTML首部的内容，说明文档的整体信息。所有首部信息并不会出现在利用WWW浏览器所看到的窗体中。HEAD/HEAD通常与某些标记符一起使用，如TITLE/TITLE标记符。在HEAD标记符中可以加入下列标记符。TITLE 描述文档的标题ISINDEX 表明可对文档进行检索BASE 显示文档的原始URLNEXTID 建立唯一的文档标识LINK 显示与其它文档的关系META户 嵌入任何附加信息在以上标记符中TITLE是必需的，其他是可选的。而且通常不全部出现，出现较多的是META标记符。如示例中的代码：（3）TITLE 标记符TITLE/TITLE指的是一份文档的标题。通常来说，每一份文档都应该有一个标题来简述这一份文档的特色或是主题。对于WWW浏览器而言，标题所在的位置依照浏览器的不同而不同，但是大部分都位于浏览器的最上方。TITLE/TITLE常常被作为搜寻主题的一个根据。一份文档的标题不宜过长，最好是用最少的文字，让读者能够清楚明了这一份文档的用处在即可。（4）BODY标记符BODY/BODY定义出一个HTML文档的体部，位于首部下面。在BODY标记符内的文字，所有使用标记符的地方都可以经浏览器正确地显示在浏览窗体中。事实上，BODY是一个建议选项，如果读者没有使用BODY的话，文档也可以使用其他标记符来显示。HTML/HTML、HEAD/HEAD、BODY/BODY3组标记符都是可选的，但是为了保持兼容性及HTML文档的易读性，习惯上还是把它们都加进去。324创建和测试Web页由于HTML文件的实质就是文本文件，因此可以用任何文本编辑器编辑HTML文件，通常可以使用Windows系统中的“记事本”程序。另外，由于Windows98/Me/2000系统中捆绑了IE5或IE5.5，因此用户在Windows中可以方便地对Web页进行简单的测试。1创建Web页使用“记事本”创建Web页的步骤如下。（1）单击“开始”按钮，选择“程序”“附件”“记事本”命令，打开“记事本”窗口。（2）在“记事本”的窗口中输入HTML代码，如图3-16所示。（3）输入代码结束后，选择“文件”菜单中的“保存”或“另存为”命令，则弹出如图3-15所示的“另存为”对话框。图3-15 在“记事本”窗口编辑HTML代码（4）选择保存文件路径，并在“文件名”文本框中键入Web页的名称，文件名必须以 .html为扩展名.如果为主页,则文件名为index.htm或index.html。（5）单击“保存”按钮，即创建了一个Web页。2.测试Web页保存了Web页之后,在所选择的文件夹中将包含所创建的Web页,该Web页文件左边有一个图标,表示可以由IE将其打开。找到刚创建的Web页并用鼠标左键双击，则可以自动启动IE浏览器，此时所创建Web页中的内容将在浏览器中显示。一般情况下浏览器可以正确显示所有HTML代码，如果浏览器不能正确地进行显示，则是由于编写的HTML代码有问题，应对代码进行更改。最方便的更改代码方式是在网页中单击鼠标右键，然后在快捷菜单中选择“查看源文件”命令（或者直接按V键）。此时将在“记事本”中打开HTML文件。更改了HTML文件之后，重新将其保存。然后切换到IE，按F5键或“刷新”按钮，则可以看到更改后的页面效果。如此重复即可以正确地对网页进行测试。 3发布Web页用户创建了Web页之后，通常可以直接将其保存在硬盘、软盘或光盘上，作为一种电子文档，也可以将其发布到Internet上，以便让全世界的浏览者都能够进行浏览者都进行浏览。发布Web页时应按以下步骤进行。（1）创建本地站点。（2）申请网页空间。（3）用FTP上传网页。 33利用HTML处理网页文本331标题处理在HTML中，用户可以通过Hn标记符来标识文档中的标题和副标题，其中n是1到6的数字。表示最大的标题,表示最小的标题。使用标题样式时，必须使用结束标记符。标题文字标记任的格式为：Hn align=“对齐方式”标题文字/Hn属性align用来设置标题在页面中的对齐方式，有left（左对齐）、center（居中）或right（右对齐）3种属性值。如示例中的标题为设置为：星座传说其中H2为2级标题,采用在对齐方式;face、color是对字体的设置，其设置方法在本书3.3.3节详细介绍。标记符默认显示宋体标记符会自动插入一个空行，不必再用空行标记符。在一个标题行下无法使用不同大小的字体。与HEAD中的定义的网页标题不同，标题格式显示在浏览器窗口内，而不显示在浏览器的标题中栏中。332段落处理在HTML中段落处理是通过段落标记来完成的，常用的段落标记符有：注释标记符、强制换行标记符、换段标记符、显示预排格式标记符、分区显示标记符和水平线等。1注释标记符不论是编写程序还是制作网页，为所做的工作添加注释都是一种良好的工作习惯。实际上，添加注释是任何程序开发工作必须遵守的规范之一。由于Web站点经常需要更新，因此，创建的Web页必须易于维护，而添加注释是增强文档可读性的重要手段。HTML的注释标记符的格式为：注释并不局限于一行,长度不受限制.结束标记符不必与开始标记符在同一行。注释的内容不在浏览器中显示.2.强制换行标记符强制换行标记符为,放在一行的末尾,可以使后面的文字、图片、表格等显示于下一行，而又不会在行与行之间留下空行，即强制文本换行。强制换行标记符BR是最常用 的标记符之一。强制换行标记符的格式为：文字BR浏览器解释时，从该处换行。换行标记符单独使用，可使页面清晰、整齐。如示例中的：摩羯座br水瓶座br3换段标记符在HTML文档中，无法用多个回车、空格、Tab键来调整文档段落的格式。要用HTML的标记符来强制换行、分段。换段标记符有两个：一个为强制换段标记符，另一个为设置段落标记符（或称文字对齐标记符）。（1）强制段落标记符强制段落标记符的格式为：文字标记不但能使后面的文字换到下一行,还可以使两段之间多一空行。由于一段的结束意味着一段的开始，所以也可省略结束标记符。一个强制换行标记符可以看作是两个换行标记符，即可在网页中键入一个标记符相当于在Dreamweaver 8 中按一次Enter 键，而键入一个标记符相当于在Dreamweaver 8中按一次Shift +Enter组合键.（2）设置段落标记符设置段落标记符的格式为：文字其中align用来设置段落的对齐方式，可以为left、center或right ，分别表示居左，居中，居右。默认为left .如图示例中的PONT color=”#FF0000”face=”华文新魏”本网页作于 October 2,200414:50 4。显示预排格式标记符当其它编辑工具编号了一段文字后，其中很可能有一些HTML文件不支持的控制符，如回车，多个空格、Tab键等。如果希望在浏览网页时保留在编辑中已经排好的段落格式，可以使用 标记符将预先排好的格式保留下来。显示预排格式标记符的格式为：PRE预先排好的格式在预排格式中，仍可以用HTML语言对文字的格式进行设置，如文字的颜色、大小等。 5分区显示标记符 文本块、一段文字或标题在网页上的布局都有3种方式：左对齐、居中和右对齐。在标记中使用align属性，其属性取值分别为：left、center和right。 可以设置布局的标记有：PP、Hn/Hn、DIV/DIV。前两种标记符前面已经介绍过。当在许多段落中设置对齐方式时，常使用DIV/DIV标记。分区显示标记符的格式为：DIV align=“对齐方式”文本或图像/DIV6水平线在页面设置中插入一条水平标尺线（Horizontal rules），可以使不同功能的文字分隔开，看起来整齐、明了。当浏览器解释到HTML文件中的标记符时，会在此处换行，并加入一条水平线段，线段的样式由标记的参考线决定。 水平线标记符的格式为: 属性align用来设定横线放置的位置，可选择left（居左）、right(居右)或center(居中)。属性size 用来设定线条粗细，以像素为单位。 属性width 用来设定线段长度，可以是绝对值（以像素为单位）或相对值（相对于当前窗口的百分比）。所谓绝对值，是指线段的长度是固定的，不随窗口尺寸的改变而改变。所谓相对值，是指长度相对于窗口的宽度而定，窗口的宽度改变时，线段的长度也随之增减，默认为100%，即始终填满当前窗口。属性color用来设定线条颜色，默认为黑色。可以采用颜色的名称，还可以用相应英文单词后用格式#RRGGBB来表示颜色。其中，RR、GG、BB分别表示红、绿、蓝成份的两位十六进制值。也就是说，可以通过指定颜色的红、绿、蓝含量来自定义一种颜色。使用RGB来表示颜色时，FF表示包含100%的该种颜色；BO表示包含75%的该种颜色；30表示包含50%的该种颜色；40表示包含25%亮度的该种颜色；00表示不包含该种颜色。例如，#FF0000表示高亮的红色；#3000B0表示浅蓝紫色；#303030表示灰色等。常见的颜色表示方法见表3-1。表3-1 十六种标准颜色色彩名色彩英文名十六进制值黑色Blank#000000蓝色Blue#0000FF水蓝色Aqua#00FFFF樱桃色Fuchsia#FF00FF灰色Gray#303030绿色Green#003000石灰色Lime#00FF00红褐色Maroon#300000藏青色Navy#000030茶青色Olive#303000紫色purple#300030红色Red#FF0000银色Silver#C0C0C0茶色Tea#003030白色White#FFFFFF黄色Yellow#FFFF00noshade设定线条为平面显示（没有三维效果），若默认则有阴影或立体效果。333文本格式处理文本处理格式包括文字设置和格式处理。1文字设置在网页中为了增强页面的层次，其中的文字可以用不同的大小、字体、字型和颜色，通常用FONT标记符来完成。如示例网页中的文字设置：星座传说FONT标记符设置格式为:被设置的文字FONT标记符具有3个常用的属性:size、face和color。（1）size属性Size属性是字号属性，用于控制文字的大小，它的取值既可以是绝对值，也可以是相对值。使用绝对数值时，字号属性的值可以从1到7（3是默认值），值越大，显示的文字越大。使用相对数值时，可以用“+”或“-”来指定相对于当前默认值的字号，例如+1表示比当前默认字号大1号。（2）face属性Face属性是字体标记符，用来指定字体样式。字体样式也就是通常所说的“字体”。例如，常用的英文字体有“Time New Roman”、“Arial”等，常用的中文字体有“宋体”、“楷体”等。在编写网页时，通过在FONT标记符中指定face属性，用户可以指定一个或几个字体名称（用逗号隔开），例如：示例文本当浏览器解释字体标记符的face属性时，尽量使用列表中指定的第一个字体显示标记符内的文字。如果那种字体在浏览器所在的系统中有的话，文字即以该字体显示。如果没有第一种字体，浏览器会尝试使用列表中的下一个字体。这种情况继续下去，直到找到匹配字体或到达列表的结束。如果找不到匹配字体，浏览器将使用默认字体（默认中文字体是“宋体”，默认英文字体是“Time New Roman”）。在HTML中有两类可选字体，即物理字体和逻辑字体。在文字标记符中很多标记符都可以互相嵌套使用，但逻辑字体标记符不可嵌套。（3）color属性FONT标记符的color属性可用来控制文字的颜色，属性值可以是颜色名称或干六进制值。参见表3-1。 如果用户需要在网页中显示某些特殊字符，例如等与HTML语法冲突的符号，或者、等无法直接用键盘输入的符号，则需使用参考字符来表示，而不能直接输入。参考字符以“&”号开始，以“；”结束，既可以使用数字代码，也可以使用代码名称。2. 文字格式处理HTML中的格式标记符有： 这些标记符都是在标记符中的。标记符和标记符在前面已经介绍过，下面着重介绍后面几种标记符。（1）标记符之间加入的文本将会在浏览器中按两边缩进的方式显示出来。（2） 标记符是指Directory List,用来创建一个普通的列表，它又称为目录列表或词汇列表；用来创建列表中的上层项目；用来创建列表中最下层项目。如示例网页中的列表：（3）标记符指Ordered List,它是用来创建一个标有数字的列表；标记符用来创建一个标有圆点的列表；标记符只能在或标记符内使用，此标记符用来创建一个列表项。若放在之间，则每个列表项加上一个数字；若在之间，则每个列表项加上一个圆点。如果加上type属性则可对黑点进行设置，type可以dic（实心圆点）或者square（实心方框），默认是disc。如示例网页中的列表：3.设置页面属性（1）设置页面背景颜色在标记符中使用bgcolor属性可以为网页设置背景颜色。例如，如果想为网页设置黑色背景，应使用以下HTML语句：在指定背景颜色时,有16种标准颜色可供选择,见表3-1.(2)设置页面背景图像单纯使用一种颜色作为背景显然有些单调,网页设计者也可选择特定图案作为页面的背景,使用BODY标记符的background属性即可。HTML语句为：BODY background=“网页背景图案的地址”使用背景图案时，如果图案小于浏览器窗口的大小，则浏览器会自动像铺地板砖一样平铺背景图案。用户也可以同时设置网页的背景图案和背景色，在这种情况下，只有在浏览器不能显示图像时才显示背景色。（3）设置文字和超链接的颜色在设置了背景图案或背景颜色后，常常需要更改正文字符和超链接的颜色，以便与背景相适应。设置正文和超链接颜色时，可以使用BODY标记符的text、link、vlink和alink属性。其中，test属性用于设置正文的颜色；link属性用于设置未被访问的超链接的颜色；vlink用于设置已被访问过的超链接的颜色；alink用于设置活动超链接（即当前选定的超链接）的颜色。如果不在BODY标记符中设置背景以及字符和超链接的颜色，则浏览器将采用默认的设置。大多数浏览器使用白色作为默认的bgcolor，黑色作为默认的text色，蓝色作为默认的llink色，紫色作为默认的vlink色，红色作为默认的alink色。3.4 利用处理网页图美观的网页是图文并茂的，一幅图和一个漂亮的按钮、标记、不但使网页更加美丽形象和生动，而且使用权网页中的内容更加丰富多彩，可见图在网页中的作用是非常明显的。作为一名网页设计者，掌握好网页图像的运用非常重要的。在示例网页中使用了几幅美丽且贴近主题的图，本章主要围绕这些图及其他一些图像的处理方法展开介绍。34网页中的图的格式我们在浏览网页时经常看到的是位图和矢量图，所谓的位和矢量图是计算机描述显示图和图形的两种不同方式。位图是排列成网格的一个个点构成的，这些点称为素点，当以恰当分辨率显示时，它们便函拼命在一起显现为一幅完整的图，而矢量图则是线条和填充色等数学信息来描述图的。在网页中常用的位格式有、矢量图格式主要为，由于受到网络宽带的制约，在网页上使用的图都是经压缩处理过的图格式，它们都有各自的特点。 格式格式在网页中使用得最普遍、最广泛、其英文全称为即可交换的图格式（文件扩展名为，是世纪年代末出现的一种用于解决跨平台图文件兼容性问题的图文件格式不管是机还苹果机都可以使用格式图格式图是种位图，它是通过素点来再现图的格式图中的素点只能使用种色，这种格式的图是由纯色组成的，因此最适合用于色较少的广西和线性艺术插图，而不适于表现真彩色照片或具有渐变图片，在网页制作中格式的图片常常用于制作标题文字、按钮、小图标等。格式图像支持两种格式，索引透明色和通道透明色，使用通道透明色可对图进行更中灵活的透明控制。甚至可以达到图的透明效果、格式的图像还有一个很大的优点，就是它可以将很多幅图像结合在一个文件中。格式的图可以被交错下载，即在浏览某些网页中，利用它设计的网页，就不会让访问者在等待的过程中只看到一片空白了。因而，在网页中采用交错的图能节省访问者在等待时间。 格式另一种使用很普遍、很广泛的图格式的格式、其英文全称，即联合图像专家组，由于它支持的颜色数量几乎没有限制。因此适合于使用真彩色或平滑过渡色的照片和图版。与格式采用无损压缩不同，格式使用有损压缩来养活图片文件的大小，因此随着图片文件大小的减少。图片的质量也随之降低。的一个典型的特点就是可以控制图片的压缩比率。例如，通过使用等网页图像处理软件，可以对图的压缩程度进行控制，以获取小文件高质量的最佳图效果。图也具有隔行扫描的特性，称顺序，具有这种特性图可以在下载过程中逐渐显示出来。 格式近年来出现一种最新图像格式是格式，即可移植的网络图。它集合了两图文件格式的优点，也是示来明区或，是公有的几种支持透明度要领的图片格式之一。格式集合了格式和格式两者的优点，一方面格式与格式类似，都具有无损压缩的特性；另一方面格式以可以显示上百万色，类似于，格式也提供对透明色和隔行扫描的支持，并且在性能上要比优越。但是，格式的压缩率要比和的大一些，不过，随着网络带宽的不断加大，该格式将普及，毕竟它具有更强大的表现能力。尽管对图格式的支持正在逐步发展，但有些非主流的浏览器及较老的浏览器并不支持格式图，即无法浏览显示它的图。目前，该格式往往用作一处过渡格式，即先用它来表现图片，最后再导出为或格式。 矢量格式上面所述的、和种格式都是标准的位图格式，但现在网页还可使用新矢量格式。相比而言，矢量格式的文件要位图格式的文件小得多，但表现力却更美丽，更具活动。矢量格式不仅表现一般的静态画面。还可以体现于占据网页上巨大优势的动画领域。34选择图形处理软件34在网页中使用图时应该注意的几个问题使用图是网页设计所必须的，而合理地运用图则为网页起到画龙点睛的作用，在网页中使用图之前，必要注意以下几个方面。 网页的图文件要小由于网络带宽的制约。对应用于中的图的一个最基本的要求就是保持文件较小。文件越小，图片浏览及下载得就越快，给浏览者的感觉通常也就越好，确保文件较小通常应从以下两个方面考虑，（） 使用图像具有所需的素大小所谓图的图素大小就是指由图像本身的像素高所确定的图大小，例如，在同一种显示模式下，一个的图就显然比的图大得多。大多数情况下，如果要将原来像素大小比较大的图缩小，应使用图形处理软件更改图的“图大小”。一般在修改之后，图的文件大小会发生显著变化。如果原图比较小，想通过修改“图大小”的方式将它广大，那图的显示质量会下降。（） 采用正确的格式进行优化处理由于不同图格式的特点不同。因此采用正确的格式可以确保在图文件比较小的情况下获得较好的显示效果。例如，对于不需要太多细节的真人照片来说，可以考虑采用格式，并且将图片质量设置小一些。 控制网页中图的数量和质量在网页中使用的图的数量显然也会影响网页文件的下载的速度，不但如此，使用不合理的图还会使用权网页脱离网站的主题。同时分散了浏览者的注意力。根据笔者多年的教学经验，初学者最容易出现的一个问题就是把一大堆图堆积到网页上，而不管图是否符合需要，这样做的结果一是使网页下载非常慢，二是不符合网页制作的基本标准用适当的形式表现适当的内容。解决这个问题的最好办法是多看，也就是多上网浏览当见识了足够多的优秀网页之后，就能够提高自己的常能力，从而能够逐步设计自己的作品。 在网页中恰到好处地添加动画与普通图一样，在网页中使用动画也要非常小心。只有设计合理，并且大小合适的动画才适合出现在网页中。如果动画的设计的不合理，不但吸引不了浏览者，还可能把他们吓跑。另外，制作动画时也应确保其最终文件较小，以便保证下载速度。3.4.4在网页中插入图制作网页时候，第一手得到的图像并不十分美观。有的是死板的矩形，有的与网页缺乏统一性，如果不做出判断。直接使用这些图，最好的方法是运用图形处理软件美化一下图，下面以第章引用的“天使部落”网页为例，介绍如何在网页中插入图。在网页中，共在处插入了图，这些图都是事先经过挑选。并且与网页主题思想相吻合，有的图是直接利用插入工具实现的。有的图是借助层实现的。不论是直接还是间接插入图，最好事先将些图利用图处理软件编辑美化一下，并将其保存到站点的奶文件夹中，也可以保存根文件夹专门用于存放图形的文件夹中以便于实现随网页上传到远程服务器中。 插入图通过在设计的网页中插入及处理图像非常容易。可以使用各种可视工具及其选项和编辑图。下面以其中一幅图的搞垮入过程来介绍如何处理图，其他图的插入方法基本相类似，读者可以试着动手做一做，具休的操作方法如下。（） 打开“天使部落”网页，将鼠标指针定位到需要插入图的位置，如网页表格的首行。（） 用下列给出的种方法中的任意一种方法都可以打开“选择图源”对话框。执行主菜单中“插入”“图”命令（或按组合键）。在“插入”面板的“常用”选项卡中，单击“图”按钮。直接用鼠标将“插入”面板的“常用”选项卡中的“图”按钮拖动到所需位置。（） 打开的对话框中选择查找图文件所在的文件夹，选中“预览”复选框。所选择图的缩略图将呈现在对话框右侧的图预览区中。（） 如果图文件存放在网站的目录中，那么从“相对于”下拉列表框中选择“文档”项。（） 单击“确定”按钮，图就插入到网页中了。如果选定的图文件不在定义网站的文件中，将弹出如图所示的信息框，提示是否将图文件复制到网站的文件夹中，应该单击“是”按钮。否则，将来本地网站文件上。（） 单击“是”按钮后，以会弹出“拷贝文件为”对话框，可以在此对话框中设置文件所保存的文件夹和文件名，如图所示。（） 单击“保存”按钮，将文件保存在网站的文件夹内。 按相同的方法再插入一幅动画，而其他的幅图将在学习第章“层”的的后再插入。 图属性参数在文档中插入图后，单击图，即图处于被选中状态，其右下方出现个用于编辑的控制点。此时，在属性面板上将显示出关于图的属性信息，图属性面板的左上方有一个缩略图，它的右边的是“图”字样，“图”的右侧标明为当前文件的大小。下方广西框中可以输入名称，以便函将来使用时调节器用该文件。其他参数义如下。宽和高：在浏览器中因条件限制而保留的宽度和高度，默认单位是素，也可以用点、英寸、毫米为单位，当在其域中键入以点、英寸、毫米为单位的数值时，自动将数值换算为以素为单位的数值。源文件；图的具体路径，可以通过单击后面的“浏览文件”按钮来选取图，也可以用鼠标拖动其指向文件图标右侧站点树型结构中对应的图文件。链接：链接的目标页面或定位点的。对齐：指定图旁边文本排列方式。替代：对图的注释，当浏览器不能政党显示图时，在图的位置用这个注释代替图。水平边距：图在水平方向与文本或其他页面元素的间距。垂直边距：图在垂直方向与文本或其他页面元素的间距。目标：链接时的目标窗口或框架。边框：图周围边界的宽度，地图：制作映射图。低品质源：当前图的低分头副本的路径，如果显示的图很大，浏览器要花很长的时间下载。如果为它指定了一个低分辨率的图副本，那么浏览器就先下载其副本，并在浏览器中显示出来，然后下载网页上的其他元素，当网页内容全部下