  
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14247
- 金币
- 2414
- 威望
- 1647
- 贡献
- 1362
|
程序编制
7 Y. U" Y2 x+ n+ { 随着WEB的发展,与浏览者的交互越来越受到网站制作者的重视。现在的主页跟最初的静态主页相比,界面更加友好,功能更加丰富。这些技术需要一些编程语言来完成,如javascript、VBSCRIPT、CGI、ASP等等。要想使自己的网站在因特网的浩瀚海洋里脱颖而出,就必须掌握这些编程语言。
! O9 D1 D7 m; `. K- ] 经验" a4 |" S6 T7 c' o: w
经验不是一门技术,却是你制胜的法宝。网站制作中的很多问题,如网站结构、版面安排、中文处理等,都需要你的经验。网上有很多设计优秀的网站,要多学习、借鉴,自己多动手、多尝试,相信你也可以做出引人注目的漂亮网站。" ~$ W) z* o7 A. P, E
页面基本元素( \- g( `4 G( z7 f- \
HTML的样子
% E3 n6 [, l) U5 _) q. G HTML语言是由一系列标记组成的,每个标记有它特定的含义。标记用<>标示,以便和页面的内容区分开来。大多数标记成对出现,后面的标记加上一个“/”,表示结束。就像这样:
" v! F9 n2 e% m/ H5 e 这是黑体。
1 z/ |5 I i, `7 t! X" u" o8 f8 T 这句话的显示结果是:1 H1 U5 j6 z, [* f. f5 \
这是黑体。
* @7 k& D3 E2 j9 A ~ 表示黑体开始,表示黑体结束,标记在浏览器里不显示。如果你用过WPS中文处理系统,就会发现HTML的标记和WPS的控制符有点类似。把HTML的各种标记弄清楚,你就是主页制作大师了。简单吗?不一定,我们还是开始学习吧。" `) N& l, |6 S; c
我的第一页
: R9 p0 f; x, P6 p" r8 A我们首先来看一个最基本的主页的HTML代码:- A& {4 h* w% X6 M/ S
5 c6 \. t9 f8 c: [; D$ w, m--------------------------------------------------------------------------------( \) Z# S/ \0 W/ a" z
first.html* H5 T9 d) I2 ] X' ^ n
这里是页的内容。8 ~* H' [" t/ j$ B8 n
! l- K) Z$ L% q" J9 ]* D
--------------------------------------------------------------------------------7 Z# k0 K" {1 [) Y9 T* n
在“记事本”里输入上面的内容,保存文件,注意把“保存类型”改成所有文件(*.*),输入文件名“first.html”。使用浏览器查看一下结果。& ?/ ~( t; Z7 f3 C2 D/ E5 J6 N" m
图1-1
( ]% \* X: [/ J3 d$ b& X: A! }2 e2 E 从浏览器的“查看”-“源代码”菜单项里,我们可以看到我们刚才输入的源代码。
2 z s4 ~4 M2 }; Z 对比源代码和显示结果,我们发现,一个基本的HTML页有以下几部分构成:% `& c! G: j& P6 v! G2 z
0 m( p& j1 l9 Q# p" X( Y 说明本页面使用HTML语言编写,使浏览器软件能够准确无误地解释、显示。* k1 e4 }1 [" A1 i2 F
/ i) [/ u6 \) J& {. y) V* ~' b+ `
HTML页头,包含页面的一些设置信息。1 E b3 F6 o% H; p8 P! ]2 B
' n/ g) N8 _+ v h/ @
TITLE是HEAD中的重要组成部分,它包含的内容显示在浏览器的窗口标题栏中。如果没有TITLE,浏览器标题栏显示本页的文件名。网上有很多人忽略了TITLE的设置,你可以经常看到UNTITLED或HOME PAGE等这样的默认标题。由于Internet Explorer的收藏夹和Netscape Navigator的书签都是用TITLE作为存储地址文件的标示,所以为你的主页起一个恰当的TITLE是很有必要的。
, W; f7 l8 H/ q" H) g8 d; W! X# O% g# Q/ ?. p
BODY包含HTML页面的实际内容,显示在浏览器窗口的客户区中。0 j# w! |3 P: Y, I$ P# [9 T! m$ f
页头; e1 ?6 k/ e5 ^5 {
除了TITLE标记外,HEAD里还有其他的几个标记。这些标记虽然不常用,但是需要有一定的了解。+ A3 p3 i: Y( p+ B
META
4 K7 V8 g0 |- v META标记用于描述不包含在标准HTML里的一些文档信息。激烈的竞争使浏览器厂商纷纷利用META开发出许多实用的功能,又使这些功能在常用的浏览器中都有效。下面介绍几个很有用的用法:% ^ M. J' n5 \& E: r; A
: O4 Y/ a: x }$ c) S" r! z% g) j% g6 v4 _ X
本页的关键字和描述。在页面里加上这些定义后,一些搜索引擎就能够让读者根据这些关键字查找到你的主页,了解你的主页内容。
/ w- z# X/ b5 k3 `/ Z* q0 a% Z1 u. i
浏览器将在60秒后,自动转到new.htm。你可以利用这个功能,制作一个封面,在若干时间后,自动带读者来到你的目录页。
- j( \) w8 ?4 d& O2 u& h( _' I3 B; V 如果URL项没有,浏览器就是刷新本页。这就实现了WWW聊天室定期刷新的特性。
2 {$ U0 B* g7 S: w* T0 {! u
9 I$ T1 B7 m2 g A0 s( M 描述本页使用的语言。浏览器根据此项,就可以选择正确的语言编码,而不需要读者自己在浏览器里选择。GB2312是指简体中文,而台湾BIG5内码的主页则是用BIG5。5 K. G F1 l7 t( N
! c8 ?; x* g5 b, t. X- {. x
强制性调用网上的最新版本。浏览器为了节约时间,在本地硬盘上保存一个网上文件的临时版本。在你要重新调用时,直接显示硬盘上的文件,而不是网上的。如果你想让读者每次都看到最新的版本,就加上这句话。: v- z# ]) y; X. Y
LINK
4 n6 i, H+ V$ F" ^9 K 显示本文档和其他文档之间的连接关系。一个最有用的应用就是外部层叠样式表的定位。格式如下:/ s+ w# f1 e- n6 F9 l& z# _
6 `3 y# e, D9 S0 z7 B
REL参数说明两个文档之间的关系,HREF说明目标文档名。关于层叠样式表,将在后面的课程中详述。9 E' s3 v7 ?4 P8 }+ F* Z
BASE) j9 M) R" W# w& O* s' N, U7 `! z
本文档的原始地址。语法是:0 D2 e2 ^/ `( L0 }
0 k, |5 ?3 w+ v$ T9 r, |1 V 这样,读者下载你的文档之后,也可以知道是从哪里下载的。2 C/ M2 V$ B( t' w8 K0 F
BODY% u" \4 X( R% E
BODY标记有一些属性,用于定义页面内的显示效果。$ v: y; P! L( r' U D% ~
ALINK、LINK、TEXT、VLINK—— 文字的颜色。
5 U8 }7 P( f1 T# x- G( s1 @( R' v ALINK:当前激活的连接的文字颜色。, m: U( k& E7 n- N; T6 Z
LINK:连接的文字颜色。) `/ i6 X2 |( j4 g& l! I( ]
TEXT:文字的颜色。" L# I' }4 d/ q3 d
VLINK:参观过的文字颜色。
, h L: Z, |* G5 ~. Q0 x. M 注意:文字的颜色要和背景色有明显的差别,以便读者浏览。
* I7 d2 N/ f1 G+ T4 l BACKGROUND、BGPROPERTIES、BGCOLOR——页面的背景部分。
. v& C* ~, y8 a/ n; P1 l2 i BACKGROUND:背景图案,该图案在页面内平铺。背景图案应保持单一色调,以保证页面文字易于阅读。, f4 V% r `; M& D
BGPROPERTIES:设置成FIXED,则背景图案不滚动。(只对INTERNET EXPLORER有效)# N B8 i3 A. [- D: x
BGCOLOR:背景色。
$ ?/ a, J% i: A4 E1 | 注意:如果你的背景图案是深色调,因之文字颜色为淡颜色,那么由于浏览器调用页面的顺序是“背景色-文字-背景图案”,那么在背景图案没有显示的情况下,你的文字在白颜色下很难阅读,所以应该选用一个跟你的背景图案颜色一致的背景色。
2 u- S, t7 e1 ^6 { LEFTMARGIN、TOPMARGIN——页边空白。(只对INTERNET EXPLORER有效)2 l$ \- v6 N: I8 N9 n
LEFTMARGIN:左边页边空白。
+ }" g# a: C6 C0 ?" j" d* H TOPMARGIN:顶端页边空白。6 e% M/ }% u/ f1 `. b# r
HTML的基本元素就是这些,怎么样,不太难吧。下一课我们就开始制作完整的HTML文件。好了,下课!如果你有什么地方不明白,就来我“办公室”问吧。 |
|