290 likes | 434 Views
第 8 章 用 FrontPage2003 制作网页. 知识点和技能点. 知识点 解 FrontPage2003 的 7 种视图方式 了解网页中的图片格式 理解“导航”、“层”、共享边框、框架的基本作用 技能点 掌握 HTML 语言的深入使用 掌握外部资源的导入方法 熟练创建与保存网站 熟练设置网页的属性 熟练各种链接的建立. 重点和难点. 网站的创建与保存 网页中文字的排版 网页中图片的插入与定位 表格的使用. 8.1.1 几种视图方式.
E N D
知识点和技能点 知识点 • 解FrontPage2003的7种视图方式 • 了解网页中的图片格式 • 理解“导航”、“层”、共享边框、框架的基本作用 技能点 • 掌握HTML语言的深入使用 • 掌握外部资源的导入方法 • 熟练创建与保存网站 • 熟练设置网页的属性 • 熟练各种链接的建立
重点和难点 • 网站的创建与保存 • 网页中文字的排版 • 网页中图片的插入与定位 • 表格的使用
8.1.1 几种视图方式 • 使用不同的视图方式可以从不同的方面查看设计的Web站点,随着站点的成长,维护站点的工作量会越来越大,但有这七种视图的帮助,维护起来就很方便了。
8.1.2网页视图的显示方式 • 网页视图中提供了4种显示方式,在工作区的左下角有三个切换显示模式。
8.2.1 新建网站 • 启动FrontPage 2003时,系统默认是在当前工作盘、当前文件夹上创建一个空白站点。空白站点是指站点存在,而站点中没有一个网页,用户可在里面添加网页。 • 操作示例演示:
8.2.2 保存网站 • 在FrontPage中,没有保存网站这个命令,它与保存网页使用的是同一个命令。所不同的是,最初的命令如果是“新建”或“打开”网站,那么保存的就是网站,如果当初命令是建立网页,则保存的就是网页。但保存网站与保存网站与保存网页有着很大的区别。
8.2.3 新建网页 • 创建页面最简单的方法就是单击FrontPage“常用”工具栏的“新建”按钮。它的右方有一个向下的小箭头,它是用来选择要新建什么,可以用“新建”按钮新建网页、站点、文件夹和任务。默认状态下是新建网页。
8.2.4 保存网页 • 用户在保存网站中的网页文件的时候,要注意将网页文件保存到同一个网站目录下(最好是默认目录)。如果分散保存网页文件,很可能会造成网页文件的丢失,影响网站的正常运转。
8.3.1 创建文件夹 • 创建文件夹的操作步骤 • 操作示例演示:
8.4 网页中的文字排版 • FrontPage2003可以通过设置字体、字号、段落、列表、背景的操作来实现 . • 操作示例演示:
8.5 在网页中使用图像 • 图像在FrontPage2003中分为图片和动态视频两类,应用较多的是图片。通过适当的放置可以起到美化网页,吸引浏览者的作用,利用FrontPage 2003可以方便地在网页中插入图像,还可以设置图像,还可以设置图像,还可以设置图像边框、大小和位置,并且可以直接对图像进行编辑。
8.6 图片的定位 • 位置的定位是指将图片准确地放在网页的某一位置或是两个或两个以上的图片在指定的位置上显示不同的先后顺序,也可以理解成相互遮挡的顺序 ① 在网页中插入两张图片,单击其中一幅图片,单击图片工具栏中的“绝对”图标。 ② 此时光标会变成十字形指针,按下鼠标左键,拖动图片到合适位置,在空白处单击鼠标,即可完成操作。
8.7图片相关操作 ◆ 插入文件中的图片 :在光标所在处插入一幅来自外部文件的图片。 ◆ 文本 :单击后,FrontPage会检查所选图片是否为GIF格式,如果不是,会将图片格式转换为GIF格式。 ◆ 自动缩略图 :可将所选中的图片转换成缩略图,并在缩略图中定义一个超链接,将其连到原始图片。 ◆ 绝对位置 :用于设置所选图片在当前层的绝对位置。 ◆ 下移一层 :将所选中的图片向下移一层。 ◆ 上移一层 :将所选中的图片向上移一层。
8.7图片相关操作 ◆ 向左旋转 :将图片向左旋转90度。 ◆ 向右旋转 :将图片向右旋转90度。 ◆ 水平翻转 :将图片按垂直线翻转180度。 ◆ 垂直翻转 :将图片按水平线翻转180度。 ◆ 加大对比度 :增加图片与背景的对比度。 ◆ 降低对比度 :降低图片与背景的对比度。 ◆ 增加亮度 :增加图片的亮度。 ◆ 减低亮度: 减低图片的亮度。
8.7图片相关操作 ◆ 剪裁 :对图片进行剪裁。 ◆ 设置透明的颜色 :单击后,FrontPage会自动检查图片是否为GIF格式,如果不是,会提示用户并自动转换格式,然后用光标单击图片,与被击中的点的颜色相同的其它区域会变透明,也就是与背景的颜色相同。 ◆ 黑白模式 :将图片转换为黑白图片。 ◆ 冲蚀 :将图片转换成冲蚀效果。 ◆ 凹凸效果 :使图片边界凹凸化。 ◆ 重新取样 :当图片过大或过小时,需要对图片重新进行调整之后再对图片重新样。 ◆ 选择 :用于选择图片。 ◆ 长方形热点 :用于定义长方形热点。 ◆ 圆形热点 :用于定义圆形热点。 ◆ 多边形热点 :用于定义多边形热点。 ◆ 突出显示热点 :用于在图片中突出显示热点。 ◆ 还原 :取消以前的操作。 ◆ 图片映射:指在一幅图片上由不同的区域来表示不同的超链接。
8.6.1 建立文字超链接 • 选中“明星风采”,单击鼠标右键,在弹出的快捷菜单中选择“超链接”菜单项 。 • 选择 “超链接”,弹出一个“创建超链接”的对话框。 • 在“创建超链接”对话框中的“URL”文本框中,输入所需要链接的网页 。
8.6.2 建立热点 • 在我们单击每个图片的文字的时候,就会链接到相应文字的图片上,这种情况称为图片映射,通常称之为热点。 图片映射分为两种: ◆ 在图片上加入一些文字,然后再分别将文字定义成超链接,也称文字热点。 ◆ 将图片划分成几个区域,再分别将各个区域定义成超链接。这种超链接区域就是热点,也称几何区域热点。
8.7.1 网页属性的定义 • 当网页制作好后,我们可将其分组,这些操作属于网页属性的定义
8.7.2 定义超链接的颜色 • 超链接的颜色设置是在“网页属性”对话框中。 网页属性对话框
8.8.1 查看站点文件 • 通过“文件夹列表”栏和主编辑窗口中的文件夹和文件,实现文件夹和文件的新建,重命名,复制,移动及删除等操作。 文件夹列表
8.10 表格的使用 • 在FrontPage的诸多功能中,制表功能也是一个很重要的方面。我们不仅利用表格显示一些有规律的数据,而且还经常使用放入文本和图形,达到对网页进行布局的目的。 • 操作示例演示:
8.11 使用框架 • 布告栏可以把一个版面分成几个部分,在每个部分可以张贴不同的内容。这种“布告栏”叫做框架。它可以把浏览窗口分为几个区域,每个部分可以显示不同的网页。 用框架制作网页
8.12使用表单 • 表单主要是由下拉列表,单行文本框、滚动文本框、单选按钮、复选框、隐藏域、按钮等元素组成 。 • 下拉列表 • 文本框 • 隐藏域 • 按钮
总结 • FrontPage2003的视图方式有网页视图、文件夹视图、导航视图、远程视图、报表视图、超链接视图、任务视图等7种视图方式。 • 创建新站点有利用菜单命令、向导和模板等两种方式。 • Web站点创建之后,要对站点进行管理和修改。 • FrontPage2003可以通过设置字体、字号、段落、列表、背景的操作来实现对网页中文字的修饰。 • FrontPage2003制作网页时会将图片扩展名不是GIF和JPEG的图形文件做格式转换。因为这两种图形格式不仅应用广泛,而且有利于节省存贮空间。
总结 • 在FrontPage2003中建立超链接分为建立文字超链接,链接到本地文件夹,链接到电子邮件,链接到图片,建立热点等方式 • 网页属性的设置包括网页属性的定义,超链接的颜色,网页中主题的使用等。 • 表格的使用包括表格的创建,单元格的控制,行列操作,表格和文本之间的相互转换等。 • 创建框架网页,其实就是划分窗口区域。 • 表单主要是由下拉列表,单行文本框、滚动文本框、单选按钮、复选框、隐藏域、按钮等元素组成。
习题 1. 如何将本地计算机中的一幅图像插入到网页中? 2.调整图片大小的方法有哪些? 3.在网页中使用图片应注意哪些问题? 4.网页中的常用的图片格式由那些? 5.在网页中能否实现图文混排,如有应如何实现? 6.什么叫绝对定位,什么叫相对定位? 7.如何将图片设置为网页背景?
习题 • 试述图片位置坐标和层顺序的概念和设置方法。 • 在网页中插入三张图片,并将图片的层顺序依次设置为1,2,3。 • 如何把一张图片设置为超链接。 • 什么是图像映射,设置图形映射由哪些方式? • 书签有何作用?如何设置书签? • 如何设置超链接的颜色?
习题 • 如何建立一个框架网页? • 使用框架网页有何好处?试在Internet上找出一些使用框架的网页。 • 如何拆份框架? • 如何实现一个不显示边框的框架网页? • 试述创建目标框架的过程。