《大学计算机应用基础第七章网页设计与网站.ppt》由会员分享，可在线阅读，更多相关《大学计算机应用基础第七章网页设计与网站.ppt（28页珍藏版）》请在三一办公上搜索。
1、第七章,网页制作,7.0 本章要求7.1 认识FrontPage 20007.2 创建站点和网页7.3 HTML制作WEB页7.4 发布WEB页,通过本章的学习，应掌握（1）FrontPage 2000的窗口组成和视图模式。（2）创建网站和网页，插入和编辑图片、表格、多 媒体信息等。（3）创建框架网页和表单。（4）通过设置个人服务器来发布WEB或预览WEB页。,返回本章首页,7.1 认识Frontpage2000,FrontPage2000的界面与Word十分相似。在窗口底部左侧有三个视图按钮。1、“普通”视图就是正常的编辑环境。2、“HTML”视图就是自动生成的HTML语句，可以修改HTML
2、源文件。3、“预览”视图可预览网页效果。,FrontPage 2000的视图,FrontPage 2000有6种视图，利用它们可以编辑网页、管理站点文件夹、生成报表、管理站点的导航图、编辑站点中的网页间的链接以及实现任务管理。1、网页视图 2、文件夹视图 3、报表视图 4、导航视图 5、超链接视图 6、任务视图,返回本章首页,7.2 创建站点和网页,一、创建站点 为了将网页发布到万维网的WEB服务器上让其他用户共浏览和使用，则需要先建立站点，再使用“导航”视图来管理网页的层次关系和链接关系。创建了新站点的同时，在“文件夹”视图或“文件夹列表”栏中会出现两个新文件夹，其中一个文件夹名是“imag
3、es”，该文件夹是为用户来保存当前网站中的图片文件，在制作网页之前可先把要用到的图片都保存到该文件夹中；另一个文件名是“_private”，该文件夹是用来保存象“_vti_cnf”之类的系统用来做缓存的文件夹，要使用过程中不要删除它们。,二、创建新网页,创建网页主要包括文字处理、图片处理、表格处理及超链接设置等操作，是一个综合性的图文并排的文档处理模块。其中常规的文字处理如文字的插入、删除、格式编排、查找和替换、复制和移动、段落格式等操作与WORD2000完全相同，用户只需采用WORD2000相类似的方法就可在FrontPage 2000中完成对文字的处理。本节重点介绍如何使用“表格”工具来对
4、网页进行布局设置、插入和编辑图片、超链接设置以及使用框架创建网页的布局等内容。,三、创建表格,使用创建表格不仅能够清晰地表现文字、图像、表单，而且能够提供导航工具和对WEB站点进行整体布局，它在网页设计过程，应用相当广泛。,1创建表格2编辑表格3设置表格的属性 可以使用“表格属性”命令来重新指定表格的宽度、对齐方式、边框粗细及单元格的边距和空间等属性。4文本与表格的相互转化,四、插入图片,1、网页的图片格式 在网页中常用的图片格式有GIF和JPEG两种格式。要注意这两种格式的区别2、在网页中插入图片3、添加视频或背景音乐4、图片属性5、编辑图片,五、特殊效果,这里简单介绍如何使用“滚动字幕”功
5、能为网页添加特殊效果。,六、网页的属性设置,网页的属性包括网页的标题、位置、背景、页边距和语言等重要信息。,1.常规属性设置（1）位置框：指定网页的URL。（2）标题：给出网页的标题（3）背景音乐：指定浏览器在打开网页自动播放 的音乐。2.背景属性设置,3.设置网页边距 主要用于设置网页相对窗口的上边距和左边距。,七、保存和预览网页,FrontPage 2000没有自动保存功能，所以在一般情况下，用户需将网页保存在当前站点内，若要将网页保存在其他位置，则需采用“文件”菜单中的“另存为”命令来保存，具体保存方法与WORD2000相似。,超链接是从一个Web页或文件到另一个Web页或文件的链接。当
6、站点访问者单击超链接时，目标将显示在Web浏览器中，并根据目标的类型来打开或运行。超链接有很多种形式，我们在这里主要介绍以下三种。（1）建立到Web页超链接（2）建立到电子邮件的超链接（3）使用书签建立超链接 使用书签可以实现在同一个页面的不同部分进行跳转，创建超链接前需先要定义书签。然后就直接把超链接指向书签就可以了。,八、创建超链接,九、框架的创建和应用,框架网页是一种特殊的HTML网页，可以将浏览器窗口分为几个区域，每个区域可以显示不同的网页。一组框架构成的网页称为框架页，每个框架页都可以采用相应的模板创建。1创建框架网页2、设置框架网页的属性3、框架网页的保存 可以保存框架所显示的网页
7、和框架网页本身。值得注意的是，在保存时，必须根据系统提示来确定为那个框架保存网页。一般情况下，FrontPage 2000将自动保存框架网页及每个框架中的网页。,十、表单,表单是用来收集站点访问者信息的集合，如收集他们的订货、发货和付费方式等信息。1、表单域 常见的表单域有以下几种：（1）文本框（2）选项按钮（3）下拉框（4）复选框（5）按钮（6）密码域（7）滚动文本框 2、创建表单（1）创建一张“请求”表单（2）创建一张“确认”表单,3、处理表单 表单的最终目标是将用户信息发送到处理这些信息的目标对象中。要实现这一功能就需要将表单信息发送到WEB服务器中，发送方法有四种：第一种是直接发送到文
8、件中。第二种是以电子邮件的形式发送。第三种是发送到数据库。第四种是发送到其他对象中。,返回本章首页,7.3 HTML制作WEB页一、基本的HTML语法 在HTML中所有的标记符都用括起来，如换行标记符，一般情况下，标记符是不区分大小写的。大多数标记符是成对出现的，如，分别表示开始标记符和结束标记符，它们之间的区别是结束标记符有一斜线。当然有一些标记符是成单出现的，如或。对于许多标记符，还包括有一些属性，以便于对标记符作用的内容进行更详细的控制。所有的属性都放在开始标记符的尖括号里，属性和标记符间用空格分开。属性和属性值间用“=”来连接，,二、HTML文件结构,1、HTML标记 HTML标记符的
9、一般形式为：，标示HTML文件的起始和终止。2、HEAD标记符 HEAD标记符的一般形式为：，标示文件的标题区，用于命名文档，提供文档内容的信息。3、BODY标记符 BODY标记符的一般形式为：，标示文件的主体区，在与间标定的是实际的文档内容，显示在Web浏览器窗口的用户区内。标记符的属性和设置方法有：,(1）页面背景颜色：bgcolor=“颜色值”。（2）页面背景图形：background=“图形文件名”。（3）文本颜色：TEXT=“颜色值”。（4）超链接：与Web页面中的链接有关。4、TITLE标记符 TITLE标记符的一般形式为：，标示HTML的标题，它是在标记符内成对出现的标记符。,三
10、、HTML文本格式,1、文本分段（1）标记符（2）br（3）hr（4）Hn(n从1-6)（5）center居中对齐标记符 2、font 标记符设定字体大小、颜色、字型的方法共有以下几种：（1）设定文件主体文字颜色：标记（2）设定字体大小、颜色、字型：标记。（3）设定字体大小、颜色、字型标记,四、HTML列表格式,HTML提供许多种类的列表标记，作项目标识，而且各种列表可以互相嵌套，嵌套时各种列表标记不能交叉。（1）无序列表的一般格式：，列表项标记。（2）有序列表的一般格式：，列表项标记。（3）目录列表的一般格式：，列表项为。,五、HTML超链接和图像格式,1、超文本链接（1）链接至另一文件或网
11、址，其常用的格式是：第一个文件。（2）链接至另一个段落 先要用给跳转到的目标位置定义书 签，然后用设置链接到所命名的书签处。,2、设置图片 常用标记设定图片，表示方法为，filename是图形文件名。IMG元素有ALIGN和ALT两个重要属性。ALIGN属性说明与文本按什么位置对齐，参数有TOP、MIDDLE、BOTTOM、LEFT和RIGHT。,六、HTML表格格式,表格由标记定义，每个表格开始是一个可选的标题(由CAPTION标记定义)。定义表格行用.标记，定义数据项用.标记，定义数据内容用.标记。,返回本章首页,7.4 发布Web页,7.4.1 在服务器上申请空间7.4.2 设置个人服务器 设置个人服务器的流程图如下所示。,7.4.3 使用FrontPage2000发布WEB页,返回本章首页,第七章结束,
