《实验八网页制作成都理工大学工程技术学院.doc

实验八 网页制作 一、实验目的 （1）熟悉HTML标记和网页文件基本结构。 （2）掌握用HTML制作简单的网页。 （3）熟悉FrontPage 2003界面及基本操作。 （4）掌握用FrontPage 2003制作网页的操作方法和步骤。 （5）学会在FrontPage 2003中站点的建立和发布。 二、实验要点及预备知识 1、网页与网页文件 网页是WWW上信息的组织形式，也是WWW上信息传输和浏览的基本单位。网页像其他文档一样把文字、图像、表格、视频等多种信息有机地组合在一起。网页区别于其他文档的本质特征是其中可以包含指向其他资源文件的超链接。显示在网页中的文字、图像、表格、视频及超链接等统称为网页元素。 网页的源文件称为HTML文档（HTML document）,是符合超文本标记语言规范的文本文件。浏览网页时实际是Web服务器将网页的源文件传输并保存到客户机上。可以这样说，网页时网页源文件在浏览器中的表现形式。 2、HTML HTML(HyperText Markup Language)是一种用来制作超文本文档的简单标记语言。其主要组成部分是一系列的标记，这些标记用来描述网页中的各个组成部分即各种网页元素。静态网页的源文件是纯粹的HTML文档，动态网页都是以HTML为基础，在HTML文档中加入了动态网页脚本。 HTML文档一般包括文件头（Head）和正文（body）两部分，其基本结构由HTML标记来描述。HTML的结构简述如下： !-- 文件注解 -- html 标识html文档的开始 head html文档头的开始标签 …… /head html文档头的结束标签 body html文件正文的开始标签 …… /body html文件正文的结束标签 /html 标识html文档的结束 3、网页制作 网页制作是建立网站的基本工作之一。制作网页的方法主要有两种： （1）用文档编辑软件直接编辑网页的源文件 一般步骤如下： ①规划网页的内容及布局。 ②在文本编辑软件中输入或修改HTML文档内容。 ③以纯文本文件格式保存文件，然后将文件扩展名改为.htm或.html。 ④用浏览器打开文件浏览网页效果，修改源文件直到满意为止。 这种方法效率低，而且也不能在制作过程中看到网页效果，一般适合用来制作较简单的网页或用来直接修改网页文件中的个别错误。 （2）使用可视化工具软件来制作网页 常用软件有FrontPage、Drearmweaver等，这些软件功能齐全、操作简便，不需要编写繁琐的HTML标记，可以像使用办公软件一样方便输入文本、插入图像等，从而高效地制作出精美的页面。 4、网站制作 网站的制作会涉及多方面，一般要经过如下步骤： ①确定网站主题网站所要包含的主要内容，一个网站必须要有一个明确的主题。搜集材料明确网站的主题后，就围绕主题开始搜集规划网站网站的结构、栏目的设置、网站的风格、颜色搭配、版面布局、文字图片的运用等制作网页上传测试利用FTP工具，把网站发布到自己申请的主页存放服务器上。网站上传后，在浏览器中打开网站，逐页逐个链接的进行测试，发现问题，及时修改，然后再上传测试。推广宣传网页做好之后，还要不断地进行宣传，提高网站的访问率和知名度。维护更新网站要注意经常维护更新内容，保持内容的新鲜才能够吸引住浏览者。html head title 简单的HTML实例 /title /head body center h3欢迎光临我的主页!/h3 hr p这是我的第一个主页。/p /center 图7-1 简单的HTML网页 /body /html ③以文本文件格式保存文件，文件名为1-1.htm。 ④在浏览器中打开文件1-1.htm，查看网页效果。如需要修改网页代码，选择IE菜单命令[查看]/[源文件]来查看并修改。 2、FrontPage网页制作 制作如图7-2所示的网页，该网页中包含文本、表格、项目列表、图像、水平线、超链接等网页元素。 操作步骤： （1）新建空白网页 选择菜单命令[文件]/[新建]，打开“新建”对话框，选择“空白网页”。此时编辑区显示文件名为new_page_1.htm。 （2）设置网页标题 选择菜单命令[格式]/[背景]，打开“网页属性”对话框，选择“常规”选项卡，在标题文本框中输入“基本信息”即可。 图7-2 frontpage网页 （3）编辑网页元素 单击主编辑区左下角的“设计”标签，然后根据