More Related Content
Similar to 《网页设计与制作》第一章:网页制作基础 (20)
《网页设计与制作》第一章:网页制作基础
- 1. 第 1 章 网 制作基页
础
网 与制作页设计
南海学院计算机系制作
- 2. 05/07/15 2
第 1 章 网页制作基础
WebWeb 和浏览器和浏览器
WebWeb
WebWeb 的特点和结构的特点和结构
WebWeb 最 大 的 特 点 是 使 用 了 超 文 本最 大 的 特 点 是 使 用 了 超 文 本
(( HypertextHypertext ))
WWWWWW 采用采用 C/SC/S (客户机(客户机 // 服务器)工作服务器)工作
模式模式
在 浏 览 器 和 服 务 器 之 间 应 用在 浏 览 器 和 服 务 器 之 间 应 用
HTTPHTTP (( Hyper Text Transfer ProtocolHyper Text Transfer Protocol ,,
- 3. 05/07/15 3
URL
Internet 上所有的资源都有一个唯一
的 URL 地址,一般将 URL 地址称为
网址。
URL 的完整格式如下:
协议 :// 主机名(或 IP 地址):端口号 / 路径名 / 文
件名
- 4. 05/07/15 4
【例】几个 URL 的例子 .
( 1 ) http://www.microsoft.com ,
用 http 协议和缺省端口号( 80 )访问微
软公司服务器 www.microsoft.com 。这
里没有指定路径和文件名,所以访问的结
果是把一个缺省主页送给浏览器。
( 2 ) ftp://ftp.pku.edu.cn/pub/ms-
windows/winvn926.zip ,用 FTP 协议访
问北京大学 FTP 服务器上路径名为
pub/ms-windows 、文件名为
winvn926.zip 的文件。
- 5. 05/07/15 5
( 3 ) http://gnacademy.org:
8001///uu-gna/index.html ,从运行在端口
号 8001 的 gnacademy.org 服务器上访问
index.html 主页。
( 4)http://www.w3.org/Addressing/URL/5-
BNF.html#httpaddress ,访问 www.w3.org
服务器上 Addressing/URL 目录下的 5-
BNF.html 网页文件中锚点标识为
httpaddress 的地方。
- 20. 05/07/15 20
4. 职能网站
职能网站具有专门的功能,如政府职能
网站等。目前逐渐兴起的电子商务网站
也属于这类网站,较有名的电子商务网
站有阿里巴巴( china.alibaba.com )
、卓越网( www.joyo.com )和当当网
上书店( www.dangdang.com )等。
- 24. 05/07/15 24
11 、、 HTMLHTML 网页网页
HTMLHTML 网页通常是由三部分内容组成的网页通常是由三部分内容组成的
:版本信息、网页标题(:版本信息、网页标题( HEADHEAD )和文档主)和文档主
体(体( BODYBODY )。)。
下面就是网 的 体框架:页结构 总
<!HTML 网页版本信息说明 >
<HTML>
<HEAD>
<! 标题标记、属性及其内容
>
</HEAD>
<BODY>
<! 主体标记、属性及其内容
>
</BODY>
- 25. 05/07/15 25
( 1 )版本信息
版本信息位于 HTML 网页文件的第一行
( 2 ) HTML 文件标记
大部分网页文件都是以 <HTML> 标记开始的,
在文件的结尾处又以 </HTML> 结束
( 3 )头部信息
HEAD 标记之间是 HTML 文档的头部,用来标明当前
文档的有关信息
在 HEAD 标记之间,使用频率最高的标记就
是 TITLE ,它用于定义显示在浏览器标题栏的文档
标题。
- 27. 05/07/15 27
( 4 )主体标记
网页的主体是“ <BODY>……</BODY>” 标
记对作用的范围 <BODY> 标记用于定义 HTML 文档主体的
开始,它能够设置网页的背景图像、背景颜色
、链接颜色和网页边距等属性,其基本用法如
下所示:
<BODY Background="URL" Bgclolr=Color
Bgpropeties=Fixed Leftmargin=n Link=Color
Alink=Color Text=Color Topmargin=n
Vlink=Color>
Bgcolor 为背景颜色。关于颜色的值后面会
详细介绍。 Text 为不包含超级链接的文字颜色
。
Link 为超级链接文字的颜色。
Alink 为正被点击的超级链接文字的颜色
。
- 28. 05/07/15 28
Leftmargin 、 Topmargin 用于设置网页
的左边距和上边框,它们是以像素为单位
【例 1 】将网页的上边距和左边距分别设置
为 40 和 30 个像素的宽度,使用黑色文本、
白色背景,未访问的链接源采用蓝色,已访
问的链接源标记为暗红色。
<BODY Background="moom.gif"
Bgcolor="White" Bgproperties=Fixed
Leftmargin=30 Link="Blue" Text="Black"
Topmargin=40 Vlink="Maroon">
Vlink 为已经点击过的超级链接文字的
颜色。
Background 设置,如果设置了背景图
片,图片会覆盖已经设置的颜色。
- 29. 05/07/15 29
22 、、 XMLXML 语言语言
XML ( eXtensible Markup
Language )被称作是下一代的网页
标记语言,也是采用各种标记来形
成网页的源代码。
XML 中包括可扩展格式语
言 XSL(Extensible Style
Language) 和可扩展链接语言
XLL(Extensible Linking
Language) 。
- 31. 05/07/15 31
1.23 Web1.23 Web 服务器端程序服务器端程序
专业的网站都是建立在使用数据库
的基础上的,要将这些数据库变成可
以通过浏览器显示和操作的 Web 页面
,就需要编写服务器端的程序。用户
向服务器传送提交的表单(个人信息
、选择结果等)需要在服务器端进行
记录、筛选等处理。大量的数据库查
询、修改处理也需要服务器端程序的
支持。
目前常用的服务器端编程技术主
要有 CGI 、 ASP 、 PHP 、 JSP 等,不
同的技术需要不同的系统环境支持。
- 32. 05/07/15 32
1.31.3 网页制作的基本方法网页制作的基本方法
制作网页的基本步骤制作网页的基本步骤
1 、确定网页的内容
2 、设计网页的组织结构
3 、资料的收集与整理
4 、选择网页的设计方法
常用的网页制作工具有
Frontpage 、 Dreamweaver 等。服务器端的
ASP 程序可以使用 Visual Interdev 、 UltraDEV
等编辑。
- 36. 05/07/15 36
1.4 Macromedia Studio MX20041.4 Macromedia Studio MX2004
Macromedia Studio MX2004 是目前应用
最广泛的网页制作工具组件,使用方便、功
能齐全, Dreamweaver 、 Flash 、 Fireworks
被称作“网页三剑客”。
在 Dreamweaver 里用丰富的层叠样式表制作
耐看,专业的网站。
Macromedia Flash 工具可较快的制作 SWF 文
件。
Fireworks 通过自动变形,用动的效果,图
片编辑工具和拖拽工具能传送较精彩的
Fireworks 图片。
- 37. 05/07/15 37
思考题思考题
1.11.1 什么是什么是 WWWWWW ?什么是网页??什么是网页?
1.21.2 一个完整的一个完整的 URLURL 由哪几部分组成由哪几部分组成
?举出几个?举出几个 URLURL 的例子。的例子。
1.31.3 如何设置如何设置 IEIE 的主页?如何用的主页?如何用 IEIE 收收
藏一个网页?藏一个网页?
1.41.4 网页中一般都使用了哪些技术?网页中一般都使用了哪些技术?
1.5 Macromedia Studio MX20041.5 Macromedia Studio MX2004 有哪有哪
几部分组成?几部分组成?