第6章 网页制作基础

更新时间:2023-09-03 18:27:01 阅读量: 教育文库 文档下载

说明:文章内容仅供预览,部分内容可能不全。下载后的文档,内容与下面显示的完全一致。下载之前请确认下面内容是否您想要的,是否完整无缺。

大学计算机基础

数学与计算机学院

大学计算机基础第六章 网页制作基础

大学计算机基础

网络的应用,不仅使计算机世界发生了日新月异的变 化,而且改变了人们工作、学习和生活的方式。说起 上网,最熟悉的操作就是打开浏览器,在地址栏中输 入地址,然后就能看到要访问信息,这些信息通常是 图片、文字、声音、动画、视频或者超链接等多媒体 信息,包含这些信息的页面文件就叫做网页。网页的 制作在过去可能是一件非常复杂的事情,但是现在利 用网页工具来制作,就能事半功倍。 本章主要网页制作的基本概念、基本工具,并以 FrontPage 2003为例来介绍设计和制作网页的基本方 法。2

大学计算机基础

本章主要内容6.1基本概念介绍 6.2网页制作工具介绍 6.3 FrontPage 2003的使用

大学计算机基础

6.1基本概念介绍6.1.1网页 6.1.2网站

大学计算机基础

6.1.1网页网页包含文字、图片、声音、动画、视频以 及超级链接等元素,通过对这些元素的有机组合 ,就构成了包含各种信息的网页。 一般说来,网页可以分为静态网页和动态网页。 静态网页是指不使用数据库而直接或间接制 作成Html的网页,这种网页的内容是固定的,修 改和更新都必须要通过专用的网页制作工具。 动态网页是指采用动态网页技术,将网站内 容存储到数据库,通过读取数据库来动态生成网 页。5

大学计算机基础

6.1.2网站网站是众多网页的集合,如果把网页看成一页 纸,那么网站就是一本书。当然也有特殊的情 况,有些网站就只有一个页面。通常在浏览器 地址栏中输入网址后首先看到的是该网站的首 页,通过单击首页上的链接可以访问到其它的 网页,这样反映一个中心或一个主题的多张网 页有序组合到一起,就称为网站。

大学计算机基础

6.2网页制作工具介绍6.2.1超文本语言HTML概述 6.2.2Dreamweaver 6.3.3FrontPage

大学计算机基础

6.2.1超文本语言HTML概述Html(Hyper Text Mark-up Language),即超文本 标记语言,是用于创建从一个平台移植到另一平台的超文 本文档的一种简单标记语言,经常用来创建Web页面。 Html文件的基本格式如下: <HTML> <HEAD> <Title> 标题部分</Title> </HEAD> <BODY> 正文部分 </BODY> 8 </HTML>

大学计算机基础

6.2.2DreamweaverDreamweaver是Macromedia公司的产品的一款 “所见即所得”的网页编辑工具,采用了多种 先进技术,用户不必编写复杂的HTML源代码。 因此,Dreamweaver是一款可以满足多层次需 求、功能强大的可视化专业网页制作工具。 目前常用的版本为 Dreamweaver 2004和 Dreamweaver 8。

大学计算机基础

6.2.3FrontPageMicrosoft® Office FrontPage 2003是Mic

rosoft Office组件之一,利用它可以直接生成HTML代码而不 用手工输入,是最简单、最容易,却又功能强大的网 页编辑工具。FrontPage采用典型的 Word 界面设计, 制作网页的过程就是加入网页元素,并对它们格式和 属性进行定义。只要你懂得使用 Word,就差不多等于 已经会使用 FrontPage。FrontPage 2003与早期的版 本比较,有许多增强功能和新增的功能。 FrontPage 2003的确是最好的入门级网页编辑工具。 目前常用的版本为 Frontpage2000 和 Frontpage 2003。10

大学计算机基础

6.3 FrontPage 2003的使用6.3.1视图方式 6.3.2创建站点 6.3.3编辑网页 6.3.4超链接 6.3.5表单制作 6.3.6特殊效果 6.3.7站点发布与维护11

大学计算机基础

6.3.1视图方式FrontPage 2003有两类视图:网页视图和网站视图。大多数 情况下,处理单个页面时,应使用“网页视图”;处理整 个网站时,应使用“网站视图”。 1.网页视图 设计视图:这是制作网页的最基本方式,也是一种所见即 所得的编辑方式。用户可以像编辑Word一样编辑编辑页面 ,不需要考虑代码,软件自动将设计转换为Html代码。 拆分视图:把工作区分成两部分,一部分显示代码视图, 另一部分显示设计视图。 代码视图:显示Html代码,可以编辑或修改代码。 预览视图:模拟网页在浏览器中的显示,用户可以预览网 页的实际效果。

大学计算机基础

2.网站视图 文件夹视图:在次视图中,站点为一组文件和文件夹,并 显示了当前文件夹下保安的子文件夹和网页文件的一些信 息,如名称、标题、笑答、类型、修改日期、修改者和注 释等。 远程站点视图:当要发布站点时,就需要使用此视图。它 能将整个网站和单独的文件和文件夹发布到任何位置,同 时显示本地网站和远程网站中的文件。而且图标和说明性 文本会指示文件和文件夹的状态,同步功能有助于确保不 会意外地覆盖任何文件或文件夹。 报表视图:可统计当前站点的情况,并以表格的显示出来 。包括:13

大学计算机基础

导航视图:用于显示网站的网页层次结构,用户可清 晰的看到各页面之间的逻辑连接关系。在此视图中, 可以新建、修改、删除的网页结构和逻辑关系。 超链接视图:将当前站点显示为一个连接文件的网络 ,它们表示了站点中页面之间的相互链接关系。双击 其中的超链接,将自动进入与之对应的网页。 任务视图:主要用来创建和管理任务,显示了当前站 点中创建的所有未完成的和已完成的任务,帮助用户 了解工作情况。

大学计算机基础

6.3.2创建站点所谓站点,就是多个相关的网页通过各种链接关联起 来的集合,即站点是网页的集合。在

使用FrontPage开 发网页之前,应建立一个本地站点,用来管理创建的 网页。 FrontPage的站点有两种类型:基于磁盘的站点和基于 服务器的站点。 1.单击“文件”菜单中的“新建”命令,在工作区的右 侧将显示新建任务的窗格,如图6-3所示。其中有“新 建网页”、“新建网站”、“模板”3个选项组,选择 “新建网站”下的任一选项。 2.单击“常用”工具栏上“新建普通网页”按钮后的下 拉按钮,在弹出的下拉菜单中选择“站点”命令。15

大学计算机基础

6.3.3编辑网页1.新建网页 2.保存网页 3.网页布局 1)表格布局 2)框架布局 4.文字操作 5.图形处理 6.表格处理

大学计算机基础

6.3.4超链接1.超链接到同一网页的不同位置 2.超链接到另一张网页或地址 3.超链接到文件 4.超链接到邮箱 5.图片上的热点链接

大学计算机基础

6.3.5表单制作1.新建表单 2.编辑表单 3.提交表单

6.3.6特殊效果1.动态效果组件 2.计数器组件 3.图片库

大学计算机基础

6.3.7站点发布与维护1.与局域网或Internet连接 2.网页存放空间 3.发布软件 4.发布站点 4.站点的维护

本文来源:https://www.bwwdw.com/article/4dpi.html

Top