网页制作与设计教程（第二版） 杨长兴 教学课件 第四章.pdfVIP

第4章 FrontPage 2000网页设计技术 本章从FrontPage的视图入手，先介绍用 FrontPage设计网页的基本操作，包括网页 的编辑、文本的修饰、列表与表格的使用、 运用图象、设置链接、声音处理等，然后 介绍FrontPage的高级应用，包括悬停按钮、 滚动字幕、计数器与动态效果等，最后介 绍表单的使用、样式与框架等。 教学重点与难点 文本的修饰与美化、列表与 表格的使用 图象与声音对象的使用 悬停按钮、滚动字幕的设置 使用表单与样式 4.1 FrontPage 2000简介 打开FrontPage 2000 ，我们发现它与其 它Office软件的窗口大致相似，主窗口由标 题栏、菜单栏、工具栏、视图栏、编辑区 和状态栏等组成。 1．标题栏、菜单栏、工具栏、状态栏 与Office其他组件类似。 2 ．视图栏 管理Web站点的工具。 3 ．工作区 是管理站点和编辑网页的主要场所。 在站点的“网页”视图模式下，网页编 辑 区的下方有三个编辑按钮它们分别代表三 种编辑模式：普通、HTML和预览。用户 一般在普通模式下设计网页，如果切换到 HTML模式下，将会看到系统自动生成的 HTML程序。 4.2 FrontPage 2000的视图 FrontPage 2000提供了六种视图模式， 即网页视图、文件夹视图、报表视图、导 航视图、超链接视图和任务视图。它们是 用户进行网站设计的有力工具，灵活运用 视图模式，将极大地方便设计操作和网站 管理。 一、网页视图 网页视图为网页的设计提供了一个工作 场所，可以在这个环境下对网页进行设计 和修改。 二、文件夹视图 打开一个网页后，系统默认是以文件夹 视图来显示的，文件夹视图与Windows 中 的资源管理器相似，它能够显示当前的 Web 中的内容是如何组织的。 三、报表视图 报表视图相当于属性检查，它能给出当 前网站的有关属性。灵活应用报表视图能 够使用户方便地了解网页的属性，便于把 握和修改网页。 四、导航视图 导航视图清楚地显示了Web 的结构，用 户可以从中了解到网站中各部分之间的逻 辑关系，它反映了网站的整个脉络。 五、超链接视图 超链接视图以图形化的界面显示了当前 网页和其他文件之间的超链接关系，也可 以显示网站与网站之间的超链接。 六、任务视图 任务视图用任务列表的方式对任务进行 管理，操作人员可以把详细的任务放在任 务列表中，这样它就会提醒设计人员需要 完成哪些任务，还剩哪些任务没有完成。 4.3 FrontPage 2000的编辑方法 一、标题段落 在网页内输入标题时，用户可先设置标 题的格式，然后再输入标题的内容， FrontPage 2000提供了6级标题。 二、修饰文本 FrontPage提供了“字体”对话框与各种 格 式工具按钮，可根据需要选择设置，以美 化文本。 1．字体选择 “字体”列表框不但显示字体的名称， 同 时还给出了字体的实际样式。 2 ．字体大小 字符的大小共有6级，其中默认级别是3 。 3 ．字体颜色 选中文字，用“调色板”为文字设置颜 色。 4 ．字符效果 ⑴字符的一般效果 “加粗”、“倾斜”和“下划线” ⑵使用上标和下标 5 ．字符间距 控制网页的文本间距、段落间距以及文 本相对于基准线的垂直位置。 “普通”、“扩充”、“紧缩”三种 “间距大小”以“pt”为单位 三、插入水平线 在网页中插入水平线有分隔文本内容的 作用。选择“插入”菜单的“Horizontal Line” 项，可在网页中插入了一条水平线。 可以对水平线进行长短或宽窄的拉伸。 还可以对水平线属性进行设置，在水平 线上单击鼠标右键，在弹出的菜单中选择 “Horizontal Line Properties”弹出属性对话 框，然后进行属性设置。 4.4 使用列表 使用列表和表格来规范网页内容可以使 网页层次分