《新编大学计算机基础教程》-第六章

第6章网页制作工具FrontPage2003随着Internet与WWW技术的迅速发展，Web站点的设计和网页制作以及发布技术成了计算机应用的一个非常重要的方面。FrontPage是一个集建立网站、管理Web站点、编写Web页面于一体的软件工具，它采用“图形化”和“所见即所得”的编辑方式，利用它可以轻松地组织和编辑网页并将其发布到指定的站点上，大大提高了网页的制作效率，并且使广大的非专业网页制作人员也可以制作出精美的网页。在网页发布之后，用户还可以对网页更新情况进行监控并更新相应站点的内容。返回6.1FrontPage2003新增功能FrontPage2003是Microsoft公司最新推出的网页制作工具，它是在FrontPage2000的基础上发展而来的，并且在FrontPage2000的基础上增加了很多重要的功能。因此，相对于FrontPage2000和更早的版本，FrontPage2003的功能更强大、规模更小，使用更方便，操作更简单，可以帮助用户在最短的时间内创建出最精美、最独具特色的网页。Microsoft开发的FrontPage2003是FrontPage家族的最新版本，它提供了更加强大的功能和灵活的特性，可以更好地创建网站，包括创建动态网站时所需的专业设计、创作、数据和发布工具。以下从站点设计、站点制作和站点维护三个方面介绍FrontPage2003的新增功能。下一页返回6.1FrontPage2003新增功能6.1.1站点设计MicrosoftFronPage2003具有经过改进的设计环境、新的布局和设计工具、模板以及经过改进的主题，这一切可以帮助用户实现自己的网站创意，而无须任何HTML知识。1.经过改进的工作环境和更大的设计区域MicrosoftFrontPage2003集中了几乎所有的Web设计功能，可以让用户全景查看整个网站，从而使得网站和网页设计比以前更加简单，更大的设计区域还可以减少滚动操作，更加方便用户浏览网站。上一页下一页返回6.1FrontPage2003新增功能2.布局表格和单元格使用布局表格和单元格，可以创建具有专业外观的网页布局。布局表格是用户为网页布局创建的框架，布局单元格是指该框架中包含网页内容（包括文本、图像、Web组件和其他元素）的区域。用户在最后决定之前，可以选择尝试预定义的布局列表或者自己绘制等多种布局方式。布局表格工具位于可以方便访问的任务窗格中。用户可以使用这些工具应用附加格式，如圆角边框、自动伸缩和其他视觉效果。布局表格和单元格共同表示用户可以添加到网页的水平与垂直区域，这些区域可以为内容提供复杂的可视结构，使用户制作出美观的网页。上一页下一页返回6.1FrontPage2003新增功能3.动态Web模板在网页上附加动态Web模板，可以快速创建共享相同布局的HTML网页，还可以指定模板内的某些区域进行编辑，而将其他区域保护起来。这意味着用户可以允许其他人添加和编辑网页内容，但仍然可以保持网页的布局和模板不变。可以在网站中使用任何数目的动态Web模板，也可以将动态Web模板添加到任意数目的网页中，还可以将动态Web模板文件保存到任意位置。如果选择从网站的一个或多个网页中取消动态模板，系统并不会从这些网页中删除内容，只会删除模板所提供的格式。上一页下一页返回6.1FrontPage2003新增功能4.图像描摹在使用图像描摹时，可以在图形程序中创建网页的外观模型图像，并将其作为直观参照，以便在FrontPage中创建或描摹网页设计。可以显示或隐藏图像，将其设置为不透明以及更改其位置。5.网页标尺和布局网格只要有好用的定位参照（如网页标尺和背景布局网格），网页的精确设计和布置就会变得十分容易。通过选择测量单位、线条样式和颜色以及间距选项，可以自定义标尺或网格。上一页下一页返回6.1FrontPage2003新增功能6.使用“层”功能在FrontPage2003中，层可以包含HTML元素，如文本和图形。在“层”任务窗格中，可以查看网页上所有层的详细列表，可以重叠、嵌套和显示或隐藏网页中的层，也可以通过使用“行为”任务窗格使层具有动画效果。7.经过改进的主题FrontPage2003使用级联样式表而不是HTML来应用主题，所以文件变得更小、更透明，并且更容易控制和修改。此外，如果网页包含在早期版本中应用的HTML主题，则会在FrontPage2003中保留这些设置。上一页下一页返回6.1FrontPage2003新增功能6.1.2开发站点FrontPage2003具有改进的创作环境、全新的图形功能、强大的编码工具（帮助用户应用并增加各种编码语言识别）以及帮助用户创建交互式脚本的工具。此外，FrontPage2003可以生成有效、简洁的HTML代码，使用户能够更好地控制代码，它包括网页视图、图形工具、脚本和编码工具和专业编码工具。FrontPage2003还扩展了网站的功能，使其能够以新的方式与人员和信息进行连接。通过将MicrosoftWindowsServer2003与MicrosoftWindowsSharePointServices一起使用，可以连接、编辑和展示来自各种数据源（包括WindowsSharePointServices数据、XML、Web服务或OLEDB数据源）的实时数据，以便在“所见即所得”编辑器中建立丰富的、交互式的数据驱动网站。上一页下一页返回6.1FrontPage2003新增功能6.1.3维护站点FrontPage2003提供了新的兼容性和HTML工具来帮助用户维护站点。1.兼容性工具（1）浏览器和分辨率协调。专业解决特定的浏览器或分辨率的兼容问题，或者查看在浏览和分辨率的各种组合（包括同时预览多个浏览器）网站的外观。（2）辅助功能检查。使用辅助功能检查器来选择网站要遵从的准则，改进辅助功能的建议将显示在列表中，并且可以在列表和网站之间来回切换以处理问题。上一页下一页返回6.1FrontPage2003新增功能2.HTML工具（1）智能查找和替换。FrontPage2003提供了基本的查找和替换功能，以及适用于HTML搜索的规则引擎。用户可以在整个网站或特定的网页中快速搜索和替换属性或标记，并且可以保存查询以备以后使用；用户还可以与其他作者共享这些查询信息，以便快速准确地更新网站。（2）编辑文本文件。FrontPage2003使用户可以在FrontPage中直接编辑HTML以外的其他文件类型。用户可以打开并编辑文本文件，包含欧洲计算机协会规范定义的ECMAScript（例如Jscript或JavaScript）的文件、XML文件和XSLT文件。文本文件的格式被设置为纯文本，而脚本文件、XML文件和XSLT文件将以所应用的代码格式显示。此外，在用户编辑XML和XSLT文件时，XML视图工具栏将提供设置代码格式的附加选项。上一页返回6.2FrontPage2003初步6.2.1FrontPage2003的启动与退出1.启动与其他的Windows程序一样，用户可以通过“开始”菜单中“程序”级联菜单，单击“MicrosoftFrontPage”命令，启动FrontPage2003；也可以在桌面上双击相应的快捷方式来启动它。2.退出退出FrontPage2003应用程序的方法也与Office2003其他组件的退出方法相同，常有以下几种退出方法：（1）单击标题栏右端的“关闭”按钮；（2）选择“文件”菜单中的“退出”命令，或者按组合键“Alt+F4”；（3）双击标题栏上的菜单控制图标；下一页返回6.2FrontPage2003初步需要注意的是，在退出FrontPage2003之前，必须对所编辑的文件进行保存。如果已经将所有文件进行保存，则可以直接退出FrontPage2003；如果没有保存，则系统会弹出一个提示对话框，询问是否要将所编辑的文件进行保存。上一页下一页返回6.2FrontPage2003初步6.2.2FrontPage2003的用户界面FrontPage2003的窗口包含标题栏、菜单栏、标准工具按钮栏、编辑区、状态栏以及任务窗格等，如图6.1所示。标题栏包括软件名称、站点所在位置等信息。菜单、工具按钮的操作方法与其他Office2003软件相同。读者在学习过程中可结合具体的内容多练习、多实践，在此不做详细说明。上一页下一页返回6.2FrontPage2003初步6.2.3FrontPage2003的视图在MicrosoftOfficeFrontPage2003中创建网站时，可以通过几种方式查看网站内容。在设计、发布和管理网站时使用不同的网页视图，可以查明并解决网站存在的问题，并使整个网站的创建、修订和发布过程更高效。1.网页视图网页视图是FrontPage2003中默认的视图方式，如图6.1所示。网页视图提供了四种视图模式，分别是设计视图、拆分视图、代码视图和预览视图。单击屏幕下方视图切换区中相应的按钮，可在这四种视图模式之间方便地进行切换。上一页下一页返回6.2FrontPage2003初步（1）设计视图。设计视图是网页视图中默认的视图方式，在这种视图方式下用户可以设计和编辑网页。此视图提供“所见即所得”的创作体验。（2）代码视图。单击视图切换区中的“代码”按钮，即可切换到代码视图。此视图提供了查看、编写和编辑HTML标识的功能。（3）拆分视图。单击视图切换区中的“拆分”按钮，即可切换到拆分视图。此视图模式可使用拆分屏幕模式来审阅和编辑网页内容，这种格式使用户能够同时访问“代码”视图和“设计”视图。（4）预览视图。单击视图切换区中的“预览”按钮，即可切换到预览视图。在这种视图模式中，不必保存网页即可看到网页在Web浏览器中的大体显示情况。在提交细微更改之前可使用此视图进行检查。上一页下一页返回6.2FrontPage2003初步2.文件夹视图文件夹视图是为了方便网站的管理和维护而建立的，选择“视图”菜单下的“文件夹”即可切换到文件夹视图，如图6.2所示。使用“文件夹”视图可以直接处理文件和文件夹以及组织网站内容。在此视图中，还可以创建、删除、复制和移动文件夹，与在MicrosoftWindows资源管理器中的操作类似。3.远程网站视图通过“视图”菜单下的“远程网站”命令可以切换到“远程网站”视图。使用“远程网站”视图可以发布整个网站，或有选择地发布个别文件；还可以在两个或更多位置之间同步文件，即确保内容相同的网站都用最近的更改进行了更新。上一页下一页返回6.2FrontPage2003初步在“远程网站”视图中查看文件夹内容时，文件将用图标和描述性文字进行标记以指明发布状态，如“不发布”“已更改”“未更改”“新建”和“冲突”。可以筛选该视图，以显示文件夹内容、待发布的文件、不发布的文件和有冲突的文件。在6.5节，将详细讨论如何使用远程网站视图进行网页的发布。4.报表视图报表视图从量化的角度给出了当前网站的统计数，选择“视图”菜单下的“报表→网站摘要”命令，即可切换到报表视图，如图6.3所示。通过“报表”视图，可以在运行报表查询后分析网站内容，也可以计算网站中文件的总大小，指出哪些文件没有与其他文件链接，标识出慢速网页或过期网页，按任务或负责处理文件的人员对文件进行分组，等等。上一页下一页返回6.2FrontPage2003初步5.导航视图导航视图是由多个导航图框组合而成的，在导航视图中可以看到网站的主页与从页之间的逻辑关系。选择“视图”菜单下的“导航”命令，可切换到导航视图，如图6.4所示。“导航”视图提供了网页的分层视图，通过此视图，可以调整网页在网站中的位置，单击网页并将其移动到网站中的新位置。6.超链接视图超链接视图形象地显示出网页之间的链接关系。单击其中的超链接，将自动进入与之对应的网页，选择“视图”菜单下的“超链接”命令，即可切换到超链接视图，如图6.5所示。“超链接”视图可以将网站中超链接的状态显示在一个列表中，此列表既包括内部超链接，也包括外部超链接，并用图标指示超链接已通过验证还是已断开。上一页下一页返回6.2FrontPage2003初步7.任务视图一般情况下，任务视图可以看成是将网站组织在一起的管理者，按照设计需求在任务视图中添加任务，所有的任务都将显示在任务列表中。选择“视图”菜单下的“任务”命令，可以切换到“任务”视图。“任务”视图以列格式显示网站中的所有任务，并在各个标题下提供有关各项任务的当前信息。上一页返回6.3建立新的网站网站不仅仅是网页的集合，更重要的是一种思想、一个目标的体现。因此，在动手建立网站之前，应该对网站进行很好的规划。6.3.1规划站点无论是设计个人站点，还是设计商业站点，都需要对其进行整体规划。规划站点包括确定站点的主题、规划站点结构、规划网页布局等。1.确定站点主题确定站点主题的目的就是能够吸引更多的访问者，要使得网站有吸引力就一定要有特色的主题。确定站点主题时应当根据需要来设置。在确定站点主题时，一般要注意以下两点：（1）选材精而小。所谓精而小是指应该根据实际情况选取自己喜爱或最擅长的一两种即可，否则会给浏览者带来没有主题的感觉。下一页返回6.3建立新的网站（2）定期更新。设计者应该根据情况定期更新站点内容，一般过时的信息很少有人去浏览，所以只有定期更新站点内容才能够吸引更多的浏览者。另外在确定站点主题的同时，设计者要考虑到材料的来源，应该将所有的材料收集好放在一起，既能方便使用，同时也提高了网站的制作效率。2.规划站点结构规划站点结构就是将站点中不同内容的网页有机地组织在一起，各个页面分别属于不同的专栏，并且提供不同的内容服务。它们之间通过超链接将其链接在一起，从而形成了一个有机的整体。（1）专栏结构。用户确定好站点主题后，需要根据内容的类型进行分类。常用的有文学专栏、图片专栏、音频专栏、讨论专栏等。上一页下一页返回6.3建立新的网站（2）超链接结构。专栏确定后，就可以设计页面间的超链接情况，包括总体结构和分支结构两种。总体结构是通过网站的首页将各个专栏的页面链接起来；分支结构是指每一个专栏中内容的链接结构。3.规划网页布局网页布局是网站的重要组成部分，包括页面的整体风格，页面各元素的排列方式，文本、图形的格式等。随着访问者要求的不断提高，页面的布局也越来越受广大访问者的关注，只有当网页布局和网页内容成功结构时才会受访问者的喜爱。上一页下一页返回6.3建立新的网站（1）页面大小。用户在规划网页布局时应该注意页面的大小，页面大小与显示器的大小以及分辨率有密切关系。一般情况下，当显示器的分辨率为800×600时，页面的显示大小约为780×428个像素；显示器的分辨率为1024×768时，页面的显示大小为1007×600个像素；分辨率越高页面显示内容越多。（2）整体造型。整体造型就是指页面的整体形象，在规划网页布局时应该注意到图形与文本的结构应该层叠有序，用户可以充分利用各种形状的图形组合，使其产生不同的视觉效果。上一页下一页返回6.3建立新的网站（3）文本和图片。文本和图片是网页中不可缺少的两大元素，在页面中以行或段落的形式出现，它们是网页中最大的构成元素。文本的摆放样式非常多，用户还可以通过DHTML将文本按所需的要求任意放置在页面中；图片也是网页中比较重要的构成元素，设计者应当根据需要将文本和图片合理地布局在页面中。上一页下一页返回6.3建立新的网站6.3.2设计一个简单的网页建立一个新的网页一般分为以下几个步骤。1.新建网页选择“文件”菜单中的“新建”选项，在窗口右侧弹出的任务窗格中，若选择“空白网页”，则FrontPage会直接建立一个不包含任何格式的空白页面；也可以选择“其他网页模板”选项，此时屏幕会显示如图6.6所示的“网页模板”对话框。在该对话框中，有三个选项标签。前两个标签提供了一些网页模板，这些模板提供了一些固定的页面框架，使用它们可以简化网页的设计过程。“样式表”标签提供了一些预设的样式表，使用这些样式表控制网页的格式，更加符合Web2.0的标准。上一页下一页返回6.3建立新的网站选择“常规”标签内的“普通网页”，单击“确定”按钮，在随后显示的FrontPage2003页面制作窗口的编辑区中输入“我的第一个网页”。如果文本内容比较多，继续输入即可。2.保存网页新的网页建立后，要以HTML的文件格式保存，类似于Word等软件，选择“文件”菜单下的“另存为…”选项，屏幕显示如图6.7所示的保存网页对话框。该对话框的操作方法与Office系列中的其他软件相同，需要考虑以下几个问题：（1）主页的文件名，习惯上命名为“index.htm”。（2）文件类型选用默认的“网页”。上一页下一页返回6.3建立新的网站（3）网页的标题默认为“新建网页1”需要修改，单击“更改标题”按钮，如图6.7所示。在随后显示的“设置网页标题”对话框中将网页标题改为“欢迎来到我的网上之家”，如图6.8所示，然后单击“确定”按钮。对话框中各项内容都设置好后，单击“保存”按钮。至此，“我的第一个网页”已经建立成功了。上一页下一页返回6.3建立新的网站6.3.3编辑文本网页中最常见的是文本信息，实际上文本信息是大多数情况下最主要的信息载体。对文本的编辑类似于Word的操作，在此仅作简要说明。1.输入文本在FrontPage2003中输入文本的方法与Word等文字处理软件的输入方法相同，在此不作详细说明。请读者自选输入方法输入以下内容：网络的发展给我们带来了前所未有的便利，但同时也给我们带来了前所未有的困惑。希望能在这里与大家一起讨论网络给我们带来的影响，我们应该如何面对这些影响。输入后的FrontPage2003窗口如图6.9所示。上一页下一页返回6.3建立新的网站文本输入以后，可以在文本中插入新的字符，也可以删除或修改已经录入的字符，操作方法与Word相同。2.文本的选定为了对指定的文本进行操作，首先要选定它，操作方法与Word类似。3.设置字体FrontPage2003中可以设置的字体类型取决于用户的操作系统。操作步骤：（1）选定相应的文本，例如第一行；（2）打开“格式”工具栏中的“字体”下拉列表框；（3）在下拉列表中选择一项字体，例如“隶书”；按照以上同样的方法将其他文本设置为“楷体”。上一页下一页返回6.3建立新的网站4.设置字号操作步骤：（1）选定相应的文本，例如第一行；（2）打开“格式”工具栏中的“字号”下拉列表框；（3）在下拉列表中选择一项字号，例如“4（14）磅”；类似地，将其他的文本设置为“3（12）磅”。除了可以设置字体、字号外，还可以设置字体的颜色、效果（加粗、倾斜及下划线等），操作方法与设置字体、字号的过程类似。5.设置标题标题实际上是一种形式，FrontPage2003提供了6级标题，在实际应用中，对于标题性文本选择相应的标题就可以设置好其格式。上一页下一页返回6.3建立新的网站操作方法也很简单，选定好要设置的文本，打开“格式”工具栏中的“样式”下拉列表框（位于该工具栏的最前端），选择相应的选项即可。6.添加背景恰当的背景颜色能够突出网页的主题，吸引浏览者的点击。当然什么样的颜色最合适，没有一定的标准，要靠设计人员自行创意。上一页下一页返回6.3建立新的网站6.3.4编辑HTML尽管FrontPage2003的功能比较丰富，但在网页设计过程中还是会遇到一些它无法解决的问题。例如，不同浏览器的兼容性的问题，利用FrontPage2003设计的网页在微软的InternetExplorer中看起来是相当正常的，但在其他的浏览器中可能就会出现一些不正常的现象。解决这一类问题的办法是直接编辑HTML文档。上一页下一页返回6.3建立新的网站另一方面，正如前面已经介绍的，在Web服务器中实际存放的是HTML文档，FrontPage2003不过是一个可视化的编辑工具，真正的网页是通过HTML文档实现的。在如图6.9所示中可以看到，在编辑区的下方有4个选项卡，单击“代码”选项卡时，就可以看到正在编辑的网页所对应的HTML文档。在这里，可以对它进行修改，操作方法与文字处理的方法相同。有关HTML的语法内容不作详细介绍，可以参考相关书籍。上一页下一页返回6.3建立新的网站6.3.5预览网页网页设计好后，在浏览器中的显示效果未必与希望的相同，因此，在网页制作过程中要经常预览它，并立即进行修改。预览网页一般有以下几种方法：（1）将制作的网页文件保存好，在浏览器中打开它即可；（2）单击编辑区下方的“预览”选项卡；（3）选择“文件”菜单中的“在浏览器中预览”选项。上一页下一页返回6.3建立新的网站6.3.6编辑网页网而制作好以后，在多数情况下，还需要进一步修改。修改一个已经制作好的网页，一般可以按以下方法操作。1.打开网页文件选择“文件”菜单下的“打开”选项，在随后显示的“打开文件”对话框中选择相应的文件名即可，其操作方法与Word等软件相同。2.编辑网页文件编辑修改网页的操作方法与新建立一个网页基本相同。如果要修改网页中的某项内容可以先将其删除，然后再重新建立；也可以选中需要修改的内容，然后用新的内容覆盖。上一页返回6.4在网页中添加元素对于一个实际的网页来说，信息量一般都比较大，仅有文本内容是远远不够的。通常我们还需要根据实际情况添加超链接、列表、表格及图形图像等。6.4.1添加超链接超链接实际了WWW的非线性，连接了不同网站及网页，甚至将全世界范围内的WWW网站及网页联系到了一起。超链接的外观可以设计成多种样式。超链接一般都直接嵌入到网页中的文本和图像中，这些文本和图像一般都与链接的目标有一定的联系，通过这些可以了解超链接的主题。下一页返回6.4在网页中添加元素代表超链接的文本与普通文本要有一定的区别，可以设置下划线，也可以设置成不同的颜色。不管是文本或者图像，当它们代表超链接时，鼠标移动到它们上面时都将会变成手形，当然也可以设置成其他形状。超链接的本质就是URL，也就是说超链接通过链接对象的URL实现访问的转移，对象可以是其他网站的主页、网站内部的其他网页、网页内的书签、图像等。URL可以理解为资源在网络上的地址。1.链接到绝对地址这是指超链接的对象是一个绝对地址（URL），通常包含协议类型、服务器的主机名、路径和文档名等四部分。假设要在如图6.9所示的网页中，增加一个“我的学校”超链接，其操作步骤如下：上一页下一页返回6.4在网页中添加元素（1）在如图6.9所示的第一行下面输入三项内容，分别是“关于我自己”“我的学校”及“我的朋友”，如图6.10所示。（2）选中“我的学校”，选择“插入”菜单中的“超链接”，屏幕显示如图6.10所示对话框。（3）在如图6.11所示的对话框中的URL地址框中输入“http.//”。（4）如果用户需要，可以通过其中的“样式”及“参数”按钮修改样式及参数。有关样式及参数的详细内容，读者可以参阅有关资料，或者查阅FrontPage2003的帮助系统。上一页下一页返回6.4在网页中添加元素2.链接到相对地址相对地址就是只给出路径和文档名，甚至路径也可以省略。浏览器默认访问超链接所在网页的协议类型、主机名及路径，一般用于到同一个网站内部其他网页的访问。到相对地址的链接的创建方法与绝对地址的创建方法基本相同，区别仅在于在如图6.11所示的URL地址框中输入的是相对地址。3.链接到书签书签可以理解为网页中的一个特殊标记，它可以是网页中任何位置的一个单词或词组，但图形不能做书签。（1）设置书签上一页下一页返回6.4在网页中添加元素操作步骤：①打开目标网页，在网页中选定要做书签的字符，例如选定“关于我自己”；②选择“插入”菜单中的“书签”选项，屏幕显示如图6.12所示的书签对话框；③在书签名称文本框中输入书签名称，也可以用默认的名称；④单击“确定”按钮，书签建立成功。（2）创建了书签以后，可以按以下步骤操作已经建立到书签的链接。操作步骤：①在如图6.10所示中选定“关于我自己”文本，按以前同样的方法打开如图6.11所示的“插入超链接”对话框；上一页下一页返回6.4在网页中添加元素②在书签下拉列到框中选择“我的简历”书签，如图6.13所示；③单击“确定”按钮。4.链接到新网页在FrontPage2003中，可以在建立新的网页的同时创建一个超链接，这项功能可节省许多时间。操作步骤：①选定用于超链接的文本或图形，选择“插入”菜单中的“超链接”选项，如图6.11所示。②在对话框的左侧有4个按钮，其中第三个“新建文档”即为“创建一新网页并链接到该网页”，单击该按钮，即可出现一个空白网页。上一页下一页返回6.4在网页中添加元素③输入新文件名保存新编辑的网页。至此，新的链接已经建立。5.其他的超链接在如图6.11所示的对话框中，左侧4个按钮中的另外3个分别用于建立到现有网页文件或互联网中的网页、书签及电子邮件的超链接，其操作方法与上面的方法没有根本的区别，在此不作详细说明。上一页下一页返回6.4在网页中添加元素6.4.2添加列表使用前面介绍的方法，可以创建各种形式文本的网页，但其形式相对还是单调一些，通过添加列表、表格等元素可以丰富网页的内容，增加网页的生动性、交互性及可读性。列表通常有无格式项目符号列表、项目符号列表、编号列表等，其操作主要通过“格式”菜单中的“项目符号与编号”选项来实现，操作方法与Word中的“项目符号与列表”类似，读者自行练习即可。上一页下一页返回6.4在网页中添加元素6.4.3添加表格表格在网页中经常使用，尤其是表示大量数据时，表格能够使网页更加整洁有序。FrontPage2003的表格与Word文档中的表格十分相似，也是由若干行和若干列单元组成。每一个这样的单元称为“一个单元格”，其中可以包含字符、图像、窗体及FrontPage的组件，甚至还可以包含另一个表格。1.建立表格在表格菜单中，提供了两种不同的建立表格的方法，即利用“绘制表格”选项手工建立表格，或者通过其中的“插入”选项自动建立表格。（1）绘制表格。选择“表格”菜单中的“绘制表格”选项，“表格”工具栏及表格指针自动被激活，如图6.14所示。表格的绘制方法与Word中相同，在此不作详细说明。上一页下一页返回6.4在网页中添加元素（2）自动插入表格。选择“表格”菜单中的“插入”|“表格”选项，屏幕显示如图6.15所示的“插入表格”对话框。根据实际需要设置好行数、列数及布局等，表格即制作成功。2.修改表格在实际应用中，常常会感觉到已经制作好的表格存在这样或那样的不足，需要对其进行适当的调整。在FrontPage2003中，可以通过直接拖动鼠标来调整表格大小、单元格的宽度，也可以在表格中添加或删除行、列，合并或者拆分单元格等。（1）插入行、列与单元格。插入行或列时，应该先将鼠标移动到表格的相应位置单击，然后选择“表格”菜单中的“插入”选项下面的“插入行和列”选项，即可插入相应的行或列，屏幕显示如图6.16所示。上一页下一页返回6.4在网页中添加元素插入单元格时，选择“表格”菜单中的“插入”选项下面的“插入单元格”选项。（2）删除行或列。操作方法与Word中基本相同，首先选定要删除的行、列或单元格，然后选择“表格”菜单中的“删除单元格”选项即可。（3）合并单元格与拆分单元格。操作方法与Word中相同。3.单元格属性单元格的属性主要包括各种对齐方式、跨距及颜色等，其设置方法如下。上一页下一页返回6.4在网页中添加元素（1）选定相应的单元格，单击右键，或者选择“表格”菜单中的“属性”选项，在其下级菜单中选择“单元格”选项，弹出“单元格属性”对话框，如图6.17所示。（2）根据实际情况设置各种参数。4.表格属性类似于单元格的属性，表格属性也有对齐方式等内容，其操作方法与单元格基本相同。上一页下一页返回6.4在网页中添加元素6.4.4添加图片多媒体是激动人心的，在网页中适当地添加多媒体对象，如语言、图像及动画等，可以增加网页的可读性，能够吸引更多的点击。1.在网页中添加图片在网页中插入图片时，要达到最佳效果，并不是越多越好。一般应该根据自己想表达的内容，精心挑选图片。插入到网页中的图片格式也有一定的要求，通常使用GIF及JPG格式。操作步骤：（1）将插入点移动到想插入图片的位置。上一页下一页返回6.4在网页中添加元素（2）选择“插入”菜单中的“图片”选项，接下来显示的图片来源下级菜单中有“剪贴画”“来自文件”及“视频”3个选项。如果插入的是自己选择的图片，选择“来自文件”选项。弹出“图片”对话框和“选择文件”对话框，如图6.18所示。（3）在“查找范围”下接列表框中选择图片文件所在的文件夹，在名称栏中直接单击图片文件名。（4）选择“确定”按钮，如果在URL地址栏中输入路径，可以将其他Web上的图片插入到本地网页中。选择“剪贴画”按钮，可以插入剪贴画。上一页下一页返回6.4在网页中添加元素2.设置图片的属性图片插入后，可以对图片属性，例如类型、大小等，进行必要的调整。在网页视图中，右击图片，在随后显示的快捷菜单中选择“图片属性”选项，如图6.19所示。通过其中的“常规”选项卡可以对图片来源、类型等内容进行设置。通过“视频”选项卡，可以在网页上插入一个AVI的文件，并对其播放方式进行必要的设置。通过“外观”选项卡，可以设置图片的外观。上一页下一页返回6.4在网页中添加元素3.创建基于图片的超链接创建基于图片的超链接与基于文本的超链接的方法完全相同，基本过程如下：（1）用前面介绍的方法在网页中插入一幅图片；（2）单击选中图片，选择主菜单“插入”项下面的“超链接”选项，打开创建超链接对话框；（3）用前面介绍的方法创建到任何目标位置的链接。上一页下一页返回6.4在网页中添加元素6.4.5添加表单到目前为止，学习的内容都是如何在网页中发布信息。在网站建设中，除了通过网页发布信息外，还应提供与浏览者交互的功能。表单便是实现这一功能的网页元素。表单浏览者能够在浏览器窗口输入信息或选择选项，这些信息再由服务器上的相应程序处理，便能实现用户认证、信息查询、收集信息等功能。可见，表单交互功能由两部分共同完成的：一是描述表单的HTML文件；一是处理用户在表单域中所输入信息的服务器端应用程序或客户端脚本，如CGI、ASP等。上一页下一页返回6.4在网页中添加元素1.插入表单域表单是由若干个表单域和相关的网页元素组成的，表单域是浏览者输入或提交信息的地方，常用的有文本框、文本区、复选框、选项按钮、下拉框、按钮等。操作步骤：①新建一个页面；②选择“插入”菜单中的“表单”命令；③在子菜单中可选择不同类型的表单域，如图6.20所示。当插入第一个表单域后，页面中会自动产生一个表单（表单周围有一个虚线框），同时自动插入“提交”和“全部重写”两个按钮，如图6.21所示。上一页下一页返回6.4在网页中添加元素④插入其他表单域。一个表单可以有多个表单域，将插入点置于虚线框之内，可插入新的表单域但不会产生新的表单；当插入点在虚线框外时，再插入新的表单域就会产生新的表单，标志为产生了新的表单虚线框。每个表单中可以有多个表单域，但只有一组“提交”和“全部重写”按钮，“提交”按钮的功能是把输入的信息提交到服务器。“全部重写”按钮的意思是消除输入的信息，恢复页面到初始状态。在表单的虚线框内，可以任意输入文字，也可以执行换行、加空格等操作，以实现对表单域的格式排版。2.表单域的属性设置双击表单域，即可弹出相应的属性对话框，在其中可设置表单域的不同属性。上一页下一页返回6.4在网页中添加元素（1）文本框。单行文本框常用于浏览者填写简单信息，如姓名、年龄、电话号码等，其属性对话框如图6.22所示。①名称定义文本框的名称，此名称在表单中应是唯一的。正是通过此名称，用户输入的信息才能提交到Web服务器上。其他表单域都有此属性，功能相同。②初始值设置文本框中显示的默认值。③宽度设置输入文本的最大长度，以字符为单位。④密码域若要以密码方式显示，则选择“是”。⑤验证有效性设置输入文本的规则，如设置文本是数字，最大为100等。上一页下一页返回6.4在网页中添加元素（2）文本区。文本区或输入多行信息，常用于浏览者填写建议或意见等。滚动文本框各项属性与单行文本框类似，其属性对话框如图6.23所示。（3）选项按钮。选项按钮（即单选按钮）提供几个选项备选，浏览者只能或必须选择其中一个，其属性对话框如图6.24所示。①组名称表单中的多个单选按钮为一个组，名称相同。②值设置单选按钮被选定时的取值。当用户提交表单时，该值被传送给Web服务器的处理程序。③初始状态设置初始时是否被选中。（4）复选框。复选框提供几个选项备选，浏览者可以选择其中一个或多个，也可不选。复选框的属性与单选按钮相似，其属性对话框如图6.25所示。上一页下一页返回6.4在网页中添加元素（5）下拉框。可以设置下拉框的不同选项，供浏览者选择，可设置为单先或多选。其下拉菜单属性对话框如图6.26所示。单击“添加”按钮，将弹出“添加选项对话框”，如图6.27所示，在其中可加入选项。（6）按钮。按钮的功能是提交表单信息或恢复表单为初始状态，其按钮属性对话框如图6.28所示。①值/标签设置按钮上显示的字符信息。②按钮类型有普通、提交、重置三种。3.表单属性设置表单以何种方式提交表单域中的数据，需要在表单属性中设置。右键单击表单中的任意区域，即可弹出表单属性对话框，如图6.29所示。上一页下一页返回6.4在网页中添加元素①发送到：（略）②文件名称：可选择将表单内容以文本形式发送。③电子邮件形式：以电子邮件形式发送。④发送到其他对象：可选择CGI等程序处理表单内容，选择此项后，需在“选项”中设置程序文件的名称。上一页下一页返回6.4在网页中添加元素6.4.6