Presentation is loading. Please wait.

Presentation is loading. Please wait.

第4章 FrontPage 2003基础知识.

Similar presentations


Presentation on theme: "第4章 FrontPage 2003基础知识."— Presentation transcript:

1 第4章 FrontPage 2003基础知识

2 4.1 FrontPage 2003概述 4.1.1 FrontPage 2003功能特点 和以前的版本相比,FrontPage 2003增加了以下新功能。 1.自定义浏览器分辨率预览检查 2.描摹图像 3.层功能 4.插入交互式按钮 5.行为的应用 6.使用网页重定向 7.检查网页错误 8.优化HTML代码 9.规划页面布局

3 4.1.2 FrontPage 2003工作界面 图4-1 FrontPage 2003的工作界面

4 4.2 网站的创建和管理 4.2.1 网站的创建 FrontPage 2003采用了多元化的方案来方便用户创建站点。用户可以分别通过模板和向导来建立站点,也可以抛开模板和向导,创建具有个人风格的站点。 1.使用模板创建站点 2.使用站点向导创建站点 4.2.2 网站的基本操作 1.打开站点 2.导入站点 3.修改网站名称 4.删除站点

5 4.2.3 网站的管理 FrontPage 2003提供了简单而强大的网站管理方案。打开一个网站后,在工作区的左下角将显示文件夹视图、远程网站视图、报表视图、导航视图、超链接视图、任务视图等视图选项,通过它们可以实现对网站的管理。 1.文件夹视图 2.远程网站视图 3.报表视图 4.导航视图 5.超链接视图 6.任务视图

6 4.2.4 网页的创建和管理 1.新建网页 1)新建空白网页 2)使用模板创建网页 2.保存网页 3.打开网页 4.关闭网页

7 4.3 网页的文字处理 4.3.1 网页标题的建立 网页标题是指显示在浏览器标题栏中的文本,如图4-21所示。 图4-21 网页标题 要更改网页标题有两种方法: (1)选择“文件”|“属性”菜单项,在弹出图4-22的“网页属性”对话框的“常规”选项卡的“标题”文本框中,输入要更改标题的文本,然后单击“确定”按钮即可。 (2)选择“文件”|“另存为”菜单项,在弹出的对话框中,单击如图4-23中的“更改标题”按钮,会弹出“设置网页标题”对话框,如图4-24所示。在“网页标题”文本框中输入要更改标题的文本,然后单击“确定”按钮即可。

8 4.3.2 文字的添加 在网页中添加文字是FrontPage中的一项最基本的操作,在FrontPage中文本的输入和Word或者WPS的文字编辑功能类似,支持输入、复制、剪切、粘贴等功能。在输入文本的时候,如果文本已经到达网页的右边界,文本会自动换行。如果需要产生一个新的行,可以按Shift+Enter快捷键进行强制换行,如图4-25所示为换行的效果;如果需要产生一个新的段落,则可以直接按Enter键,如图4-26所示为换段的效果(FrontPage中行与段之间的区别:行在HTML语言中的标记是<BR>,本行与上一行之间在位置上的衔接是紧密的;段在HTML语言中的标记是<P>,本段与上一段之间在位置上会多出一个空行的距离)。

9 4.3.3 文字的修饰 1.使用格式工具栏修饰字体 2.使用格式对话框 3.设置边框和底纹 4.其他网页元素的添加 1)插入水平线 2)插入时间和日期 3)插入特殊符号 4)插入站点计数器 5)插入列表 (1)创建项目符号列表。 (2)创建编号列表。

10 4.4 网页图像的基本操作 在网页制作过程中使用图像,目的是美化页面,通过图像展示页面所具有的个性,可以更好地吸引浏览者。 网页支持的图像格式主要有:GIF、JPEG、BMP、TIFF、TGA、RAS、EPS、PCX、PNG、PCD、WMF等。在网页设计时使用最多的图像格式是GIF和JPEG。在FrontPage 2003中会自动按图像颜色的多少进行图像格式转换,当图像颜色多于256种颜色,转换为JPEG格式,否则转为GIF格式。 4.4.1 图像的添加 在FrontPage中可以插入本地计算机上的图像也可以插入FrontPage剪贴库中的图案和艺术字。 1.从本地文件夹中添加图像 2.插入剪贴画 3.插入艺术字 4.插入背景图片

11 4.4.2 图像的编辑 在网页中,单击一幅图片,选择“视图”|“工具栏”|“图片”菜单项,弹出如图4-49所示的“图片”工具栏,通过图片工具栏可以对图像进行简单编辑。 图4-49 图片工具栏 1.图片的属性设置 2.在图片上添加文本 3.设置自动缩略图 4.图片的裁切 5.设置图片的替代文本 4.4.3 图像的保存

12 4.5 建立超链接 常用的超链接形式有文本超链接、图像超链接和电子邮件超链接。 4.5.1 文本超链接 1.建立文本超链接 2.编辑文本超链接 (1)设置超链接的颜色。 (2)设置超链接的字体。 4.5.2 图像超链接 在制作网页时经常会用到图像超链接。图像超链接可分为普通图像超链接和热点链接两种。普通图像超链接是指一幅图像只有唯一一个超链接,而热点链接是指在一幅图像上的不同区域各自拥有不同的链接,也就是说一幅图像上有多个链接。 1.为普通图像添加超链接 2.设置热点链接

13 可以在网页中添加一个指向网站设计者电子邮件的超链接,方便浏览者和他联络。 4.5.4 书签超链接
4.5.3 邮件超链接 可以在网页中添加一个指向网站设计者电子邮件的超链接,方便浏览者和他联络。 4.5.4 书签超链接 书签是隐藏的HTML标记,因为它对浏览者来说是不可视的,而在FrontPage编辑状态下是可视的。使用书签超链接在浏览网页时可以快速实现内容的跳转,在页面中先创建书签,再创建指向当前页面不同书签的超链接,就可以实现在同一个页面里快速跳转到指定内容的功能,当然也可以在多个网页之间进行跳转。

14 4.6 建立表格 表格是网页设计中使用最频繁、最重要的元素之一,通常使用表格来排列数据、布局版面。用表格布局网页,便于网页元素的编辑和插入,提高网页的有序性、条理性、规划性;没有用表格布局的页面,在向页面中添加网页元素的时候往往会出现定位错误;使用表格布局还具有随意性,可以根据自己的喜好,自由地将表格拆分、合并和定位。 4.6.1 表格的创建 在FrontPage 2003中插入表格的方法有很多种,如使用“插入表格”按钮、使用菜单项、使用手绘表格等。 1.使用“插入表格”按钮创建表格 2.使用菜单项创建表格 3.使用“手绘表格”创建网页

15 1.表格的基本操作 1)选择表格 2)插入行或列 3)删除行或列 2.单元格的基本操作 1)选择单元格 2)删除单元格 3)合并单元格
4.6.2 表格的基本操作 1.表格的基本操作 1)选择表格 2)插入行或列 3)删除行或列 2.单元格的基本操作 1)选择单元格 2)删除单元格 3)合并单元格 4)拆分单元格 3.表格的嵌套 4.6.3 表格的设置 1.设置表格属性 2.设置单元格的属性

16 4.6.4 表格的网页布局功能 表格的一个重要作用就是表格的布局功能,在以往的FrontPage版本中一般是利用普通的表格来布局页面,在FrontPage 2003中引入了一些新的布局功能。 1.使用表格布局 2.使用布局表格布局 3.手工绘制创建布局表格布局页面

17 4.7 建立表单 网站的交互性一般是通过表单程序来实现的,网页浏览者将信息通过表单发送到Web服务器端,Web服务器接收后做出相应的回应,最终将反馈信息返回到个人的浏览器。 4.7.1 表单的构成 表单由表单域组成,表单域的主要构成如下。 文本框 :提供输入单行的文本,如:姓名、密码等。 文本区 :提供输入多行的文本,如:论坛中的签名、个人简介等。 选项按钮 :提供单项选择,如:性别选择、学历选择等。 复选框 :提供多项选择,如:个人爱好、性格选项等。 下拉框 :提供下拉式菜单,如:国籍、属性等。 按钮 :提供提交表单和重置表单等功能。 图片 :提供图片用作提交按钮,如:论坛注册中的头像选择等。

18 4.7.2 使用模板创建表单 4.7.3 使用向导创建表单 4.7.4 自定义表单

19 4.8 框架的使用 框架是一种特殊的网页布局,之所以说特殊是因为它并不是真正意义上的网页布局工具。表格和布局表格是在现有的一个页面上将网页进行区块的划分,然后在这些区块中填入网页元素,而“框架”只给网页分区,而不提供实际内容,每个框架都可以显示独立内容的网页,也就是说有框架的网页可以根据框架数同时显示多个独立内容的网页。 4.8.1 框架的创建与保存 1.框架的创建 2.框架的保存 4.8.2 框架的基本操作 1.拆分框架 2.删除框架 3.设置框架链接 4.8.3 框架的属性设置

20 滚动字幕是用来显示滚动文本的,如站点更新内容的公告等。 4.9.3 创建交互式按钮
4.9 一些特殊效果的运用 4.9.1 制作不断弹出提示窗口的页面 这种类似于恶作剧的页面效果,是通过JAVA小程序来实现的,但是很多网页设计的爱好者对于编程并不是十分了解。基于这种原因,FrontPage 2003提供了能够在网页中直接插入JAVA脚本程序的“行为”功能,使用起来十分简单方便,使网页设计爱好者能够在不精通编程的情况下也能够使用这些网页特效。 4.9.2 插入滚动字幕 滚动字幕是用来显示滚动文本的,如站点更新内容的公告等。 4.9.3 创建交互式按钮 交互式按钮是一种具有动态效果的按钮,当鼠标悬停在按钮上时,按钮的样式就会发生变化 。 4.9.4 消除超链接的下划线 在网页中对文字设置完超链接后,超链接文字下会出现一条下划线,有时候为了页面风格的统一和美观,需要将超链接文字下面的下划线去掉。

21 一个网站在发布前应该先对其进行一系列的测试和修改,以确保发布后能正常工作。 4.10.1 网站的测试
4.10 网站的测试与发布 一个网站在发布前应该先对其进行一系列的测试和修改,以确保发布后能正常工作。 网站的测试 (1)在FrontPage 2003中打开要测试的站点。 (2)选择“视图”|“报表”|“网站摘要”菜单项,单击报表视图。在报表视图中可以显示所有文件的数量、大小、未链接的文件和断开的链接等信息,如图4-157所示。 (3)单击“报表”中的某一项内容查看具体信息。 (4)根据“报表”视图提供的信息找出网页存在的问题并立即修改。如:断开的超链接、无效的超链接、组件错误等。 网站的发布

22 4.11 综合实例 利用FrontPage 2003来制作一个网站的首页。详见书上。


Download ppt "第4章 FrontPage 2003基础知识."

Similar presentations


Ads by Google