FrontPage2003基础知识.ppt

1 第4章FrontPage2003基础知识 2 4 1FrontPage2003概述4 1 1FrontPage2003功能特点和以前的版本相比 FrontPage2003增加了以下新功能 1 自定义浏览器分辨率预览检查2 描摹图像3 层功能4 插入交互式按钮5 行为的应用6 使用网页重定向7 检查网页错误8 优化HTML代码9 规划页面布局 3 4 1 2FrontPage2003工作界面图4 1FrontPage2003的工作界面 4 4 2网站的创建和管理4 2 1网站的创建FrontPage2003采用了多元化的方案来方便用户创建站点 用户可以分别通过模板和向导来建立站点 也可以抛开模板和向导 创建具有个人风格的站点 1 使用模板创建站点2 使用站点向导创建站点4 2 2网站的基本操作1 打开站点2 导入站点3 修改网站名称4 删除站点 5 4 2 3网站的管理FrontPage2003提供了简单而强大的网站管理方案 打开一个网站后 在工作区的左下角将显示文件夹视图 远程网站视图 报表视图 导航视图 超链接视图 任务视图等视图选项 通过它们可以实现对网站的管理 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语言中的标记是 本行与上一行之间在位置上的衔接是紧密的 段在HTML语言中的标记是 本段与上一段之间在位置上会多出一个空行的距离 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 在FrontPage2003中会自动按图像颜色的多少进行图像格式转换 当图像颜色多于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 3邮件超链接可以在网页中添加一个指向网站设计者电子邮件的超链接 方便浏览者和他联络 4 5 4书签超链接书签是隐藏的HTML标记 因为它对浏览者来说是不可视的 而在FrontPage编辑状态下是可视的 使用书签超链接在浏览网页时可以快速实现内容的跳转 在页面中先创建书签 再创建指向当前页面不同书签的超链接 就可以实现在同一个页面里快速跳转到指定内容的功能 当然也可以在多个网页之间进行跳转 14 4 6建立表格表格是网页设计中使用最频繁 最重要的元素之一 通常使用表格来排列数据 布局版面 用表格布局网页 便于网页元素的编辑和插入 提高网页的有序性 条理性 规划性 没有用表格布局的页面 在向页面中添加网页元素的时候往往会出现定位错误 使用表格布局还具有随意性 可以根据自己的喜好 自由地将表格拆分 合并和定位 4 6 1表格的创建在FrontPage2003中插入表格的方法有很多种 如使用 插入表格 按钮 使用菜单项 使用手绘表格等 1 使用 插入表格 按钮创建表格2 使用菜单项创建表格3 使用 手绘表格 创建网页 15 4 6 2表格的基本操作1 表格的基本操作1 选择表格2 插入行或列3 删除行或列2 单元格的基本操作1 选择单元格2 删除单元格3 合并单元格4 拆分单元格3 表格的嵌套4 6 3表格的设置1 设置表格属性2 设置单元格的属性 16 4 6 4表格的网页布局功能表格的一个重要作用就是表格的布局功能 在以往的FrontPage版本中一般是利用普通的表格来布局页面 在FrontPage2003中引入了一些新的布局功能 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一些特殊效果的运用4 9 1制作不断弹出提示窗口的页面这种类似于恶作剧的页面效果 是通过JAVA小程序来实现的 但是很多网页设计的爱好者对于编程并不是十分了解 基于这种原因 FrontPage2003提供了能够在网页中直接插入JAVA脚本程序的 行为 功能 使用起来十分简单方便 使网页设计爱好者能够在不精通编程的情况下也能够使用这些网页特效 4 9 2插入滚动字幕滚动字幕是用来显示滚动文本的 如站点更新内容的公告等 4 9 3创建交互式按钮交互式按钮是一种具有动态效果的按钮 当鼠标悬停在按钮上时 按钮的样式就会发生变化 4 9 4消除超链接的下划线在网页中对文字设置完超链接后 超链接文字下会出现一条下划线 有时候为了页面风格的统一和美观 需要将超链接文字下面的下划线去掉 21 4 10网站的测试与发布一个网站在发布前应该先对其进行一系列的测试和修改 以确保发布后能正常工作 4 10 1网站的测试 1 在FrontPage2003中打开要测试的站点 2 选择 视图