[计算机10.ppt

第九章 网 页 制 作 计算机文化基础 宁夏大学计算中心 内容提要 网站制作作业 网页与主页 超文本标记语言HTML 网页与网站 网站制作步骤 网站基本结构 网页制作步骤 网页的基本分类 网站创建的基本方法 认识FrontPage FrontPage 2000的操作环境 网页视图 文件夹视图 报表视图 导航视图 超链接视图 任务视图 基本网页编辑 基本网页编辑 基本网页编辑 认识图形格式 图形的插入 建立超链接 图像映射 网页的布局 表格的创建 表格的编辑 表格布局 框架布局 框架的创建和保存 框架属性设置 框架之间的超链接 给予网页一致性外观 主 题 共享边框 导航栏 创建和使用表单 使用网页层次组件 发布站点 免费网页存放空间 　　网页的描述语言是HTML，但在使用中，它是一种极差的页面描述语言，它的设计者将主要精力放在了设备独立的特性之上，使得HTML几乎丧失了控制网页外观的全部能力。 　　表格和框架是用于HTML网页布局的最为常用的工具，它们都可以在长方形的网格线中排列内容。两者相比，表格的灵活性最大，但框架能够避免对内容的过多重复。 演示： 1）表格布局网页：在FrontPage　2000中导入中国人网站主页 ，打开981773网站，看第1~4代计算机网页， 体会用表格安排文本和图形的方法。 2）框架布局网页：看清华大学站点的中文版中的办公电话网页、981773网站中主页和“艰难的历程”网页，体会框架布局的妙处。 　　本幻灯片讲解创建表格的三种方法。 演示：分别用三种方法创建三个表格： （1）手动绘制表格，通常用于创建一个不规则的表格。 （2）用指定表格属性的方式创建表格。 （3）通过指定列数和行数来快速创建一个规则的空表。 　　无论用哪种方法创建表格，都不可能一次就能得到满意的结果，可以对表格做进一步的编辑，如：插入/删除行和列、单元格的合并与拆分、设置表格和单元格的属性等等。 　　插入/删除行和列的操作与word完全相同，在此就不再赘述。 　 单元格的合并与拆分：合并/拆分单元格是表格编辑的重要命令，通过此命令就可以轻松创建不规则的表格，演示，使用上一张幻灯片中建立的表格，选择一个或多个单元格，使用表格/合并单元格或表格/拆分单元格命令。 　 设置表格属性：演示，使用上一张幻灯片中建立的表格，选择表格/属性/表格属性命令，弹出表格属性对话框，在此对话框中设置表格的属性。 1）对齐方式：表格在网页中可以左对齐、右对齐、居中和两端对齐。 2）浮动：文本和表格的环绕，可以是表格相对于文本左对齐或右对齐。设置了浮动功能后，前面的对齐方式就不起作用了。 3）单元格边距：单元格内文本与边框的距离。 4）单元格间距：单元格边框间的间距。 5）指定宽度/指定高度：设置表格的大小，有两种度量方式，像素是绝对度量单位，百分比是相对度量单位，使用百分比设置的表格，表格大小会随浏览器的大小自动调整，保持百分比不变。 6）边框/粗细：表格边框的宽度。 7）边框/颜色：边框的颜色。 8）背景颜色和背景图片：为表格设置背景色或背景图片。 　 设置单元格属性：演示：制作幻灯片中的样例，在表格中输入文字，选择单元格，使用“表格” /“属性” /“单元格”属性命令，弹出“单元格属性”对话框，在此对话框中设置各单元格中元素的属性，单元格中文本的水平对齐和垂直对齐方式、行跨距和列跨距 　　本幻灯片上有三个使用表格布局网页的样例，左上图为一1×2表格，放置一幅图片和图片的说明文字，且设置了背景图片；左下图为一2 ×4表格，第1行的第2、3列单元格已合并，用来放置类别，并设置了背景色；右图为一3 ×3表格，第一列的两行单元格已合并，用来放置说明文字，其余的四个单元格中用来放置图片。 　　正是由于表格的引入，才使得网页的制作者能够随心所欲地控制网页的外观。表格的缺点是不能动态地更新表格中的内容，对于需要动态更新网页局部区域内容的布局，要使用框架工具。 　　在使用表格进行页面布局时，我们一般去掉表格的边框线，即将边框线的粗细设置为0。 　　本幻灯片介绍框架布局功能。 　　我们在网上浏览时，会发现有一些网页分成几个窗口，有的窗口是可以改变的，而有的窗口内容始终不变，如幻灯片中的样例，当单击左边窗口的超链接时，会在右下窗口显示相应的网页，而右上窗口的内容始终不变，这就是框架结构。 　　创建这个网页需要四个网页文件：1个“框架集”文件和3个网页文件，“框架集”文件用于定义框架区域，为每个框架定义位置、大小、名称和初始网页，而该文件本身并不包含可见内容