  
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14247
- 金币
- 2414
- 威望
- 1647
- 贡献
- 1362
|
程序编制; k, {9 a; u. y0 v& y
随着WEB的发展,与浏览者的交互越来越受到网站制作者的重视。现在的主页跟最初的静态主页相比,界面更加友好,功能更加丰富。这些技术需要一些编程语言来完成,如javascript、VBSCRIPT、CGI、ASP等等。要想使自己的网站在因特网的浩瀚海洋里脱颖而出,就必须掌握这些编程语言。
% ` ~( q6 d9 z6 O/ Y 经验" }$ i% D: u* r) T( S& {* `
经验不是一门技术,却是你制胜的法宝。网站制作中的很多问题,如网站结构、版面安排、中文处理等,都需要你的经验。网上有很多设计优秀的网站,要多学习、借鉴,自己多动手、多尝试,相信你也可以做出引人注目的漂亮网站。
6 L7 c; E& r4 n, V 页面基本元素, b7 [2 X( {& w8 m6 ^( Q* B" K5 Z
HTML的样子. P+ a4 e$ M4 Z9 r
HTML语言是由一系列标记组成的,每个标记有它特定的含义。标记用<>标示,以便和页面的内容区分开来。大多数标记成对出现,后面的标记加上一个“/”,表示结束。就像这样:* Q# x- y/ |, h" \* t0 S
这是黑体。+ w+ e4 {* V% U/ ]. w
这句话的显示结果是:$ h( i! c. W, N" L
这是黑体。& p" F3 z* g7 z
表示黑体开始,表示黑体结束,标记在浏览器里不显示。如果你用过WPS中文处理系统,就会发现HTML的标记和WPS的控制符有点类似。把HTML的各种标记弄清楚,你就是主页制作大师了。简单吗?不一定,我们还是开始学习吧。
9 _2 D- Y) [9 e [9 U1 `; d 我的第一页
' Y( l% E) [! F. }' k Q6 s9 R我们首先来看一个最基本的主页的HTML代码:4 |* i2 y- D! X
# u- R& |8 W0 ^- j4 d
--------------------------------------------------------------------------------
1 `/ K; M8 c! K1 s/ \2 K* tfirst.html
3 n& d; e5 w9 p- c, w这里是页的内容。) k& U2 b, l3 c
% K# k% @8 W% N+ P# U# A, n$ B
--------------------------------------------------------------------------------9 L3 M: j/ m5 P- C
在“记事本”里输入上面的内容,保存文件,注意把“保存类型”改成所有文件(*.*),输入文件名“first.html”。使用浏览器查看一下结果。& |# x) h2 t1 c' i0 D
图1-11 g) l6 o8 |1 \( h4 j) `
从浏览器的“查看”-“源代码”菜单项里,我们可以看到我们刚才输入的源代码。
6 Z+ v. Q7 M0 G' h9 s) G 对比源代码和显示结果,我们发现,一个基本的HTML页有以下几部分构成:/ z( G2 i# z7 f, z
# V' X6 Q; U, h3 H5 C+ q* V5 K
说明本页面使用HTML语言编写,使浏览器软件能够准确无误地解释、显示。4 \5 D( X6 I( B/ T6 j
/ d5 a; D+ w h' c' d! @# m9 Z; N HTML页头,包含页面的一些设置信息。2 B# _/ \, t/ k; b/ @5 k6 D' h, ]
! v9 f/ @1 S5 `4 t* T; H1 u
TITLE是HEAD中的重要组成部分,它包含的内容显示在浏览器的窗口标题栏中。如果没有TITLE,浏览器标题栏显示本页的文件名。网上有很多人忽略了TITLE的设置,你可以经常看到UNTITLED或HOME PAGE等这样的默认标题。由于Internet Explorer的收藏夹和Netscape Navigator的书签都是用TITLE作为存储地址文件的标示,所以为你的主页起一个恰当的TITLE是很有必要的。
3 @) @% Q. I R% J0 Z. r6 Z( Z
; z+ }3 ^& a2 M4 B- f. w- B/ W BODY包含HTML页面的实际内容,显示在浏览器窗口的客户区中。
* U. |; R. f" d/ V' y1 R 页头
9 k0 E9 F3 a) }6 O 除了TITLE标记外,HEAD里还有其他的几个标记。这些标记虽然不常用,但是需要有一定的了解。
2 [0 w7 C4 A$ x, f- h. Z. l! g) ~META* @: N9 q, M: X% H9 `+ f' S0 ?
META标记用于描述不包含在标准HTML里的一些文档信息。激烈的竞争使浏览器厂商纷纷利用META开发出许多实用的功能,又使这些功能在常用的浏览器中都有效。下面介绍几个很有用的用法:4 X5 C& J5 @ q; \. X
/ M5 x/ ]! Z7 H |" U+ m+ f+ i+ I- d( W5 C2 p& I* T
本页的关键字和描述。在页面里加上这些定义后,一些搜索引擎就能够让读者根据这些关键字查找到你的主页,了解你的主页内容。
& p: t' {) y; M7 T- ?3 T% s4 @5 j& a& X# c- }; c
浏览器将在60秒后,自动转到new.htm。你可以利用这个功能,制作一个封面,在若干时间后,自动带读者来到你的目录页。. Y1 j' x, A, m& V& g
如果URL项没有,浏览器就是刷新本页。这就实现了WWW聊天室定期刷新的特性。$ C0 f2 U d/ K( A& l5 p
8 J! r/ | v/ X+ S- }) s 描述本页使用的语言。浏览器根据此项,就可以选择正确的语言编码,而不需要读者自己在浏览器里选择。GB2312是指简体中文,而台湾BIG5内码的主页则是用BIG5。
1 u& t# z' m0 Y+ b& k) l
, g U7 Y" l s+ _' U8 B 强制性调用网上的最新版本。浏览器为了节约时间,在本地硬盘上保存一个网上文件的临时版本。在你要重新调用时,直接显示硬盘上的文件,而不是网上的。如果你想让读者每次都看到最新的版本,就加上这句话。
. j. j+ c7 |1 x2 ~ J }8 _LINK
7 P! P+ Z" O6 f0 A+ |3 S* s) x 显示本文档和其他文档之间的连接关系。一个最有用的应用就是外部层叠样式表的定位。格式如下:
. G3 j+ ^- o8 g# n5 t 4 j' J7 v7 R' c, Q) q- t0 }
REL参数说明两个文档之间的关系,HREF说明目标文档名。关于层叠样式表,将在后面的课程中详述。
7 v. C' |, ~) z: C) M! RBASE
H8 T& N" V+ l t* s% g# O- x9 }1 k 本文档的原始地址。语法是:
2 u# L5 ]6 l7 g& \0 x$ ]9 b
) |3 q& V+ O9 d1 z1 B8 z 这样,读者下载你的文档之后,也可以知道是从哪里下载的。! s4 i/ E' W7 f
BODY
- j. E4 D- z9 z% s6 Y BODY标记有一些属性,用于定义页面内的显示效果。/ ?/ u& X0 ?# ^' i6 r; z9 p
ALINK、LINK、TEXT、VLINK—— 文字的颜色。7 a: P, q% j: w% G, |( G {
ALINK:当前激活的连接的文字颜色。9 x1 s# Y" n/ a3 J% Z: M
LINK:连接的文字颜色。
# v% Q3 T, E7 C- C7 d TEXT:文字的颜色。
. [5 W0 `) M" t: K: \2 a: b6 { G8 { VLINK:参观过的文字颜色。7 w0 a d @& I: Q+ L1 b6 J( T1 S0 `# _
注意:文字的颜色要和背景色有明显的差别,以便读者浏览。
! Q. f. T* K! L/ R BACKGROUND、BGPROPERTIES、BGCOLOR——页面的背景部分。
# m# p5 }( W/ [( }. p6 h BACKGROUND:背景图案,该图案在页面内平铺。背景图案应保持单一色调,以保证页面文字易于阅读。# {4 B D/ c+ l# f# Z$ X
BGPROPERTIES:设置成FIXED,则背景图案不滚动。(只对INTERNET EXPLORER有效) i. S6 f4 i$ U$ G P
BGCOLOR:背景色。: {& |. R2 p- y: e2 L4 w5 r% j
注意:如果你的背景图案是深色调,因之文字颜色为淡颜色,那么由于浏览器调用页面的顺序是“背景色-文字-背景图案”,那么在背景图案没有显示的情况下,你的文字在白颜色下很难阅读,所以应该选用一个跟你的背景图案颜色一致的背景色。
S6 q# W p' R) L* V; n5 l LEFTMARGIN、TOPMARGIN——页边空白。(只对INTERNET EXPLORER有效)
7 h; Z+ ^5 E7 U# W) }+ P! B) G! p LEFTMARGIN:左边页边空白。
; K$ c# ~- l* M/ ^ TOPMARGIN:顶端页边空白。% E/ {; p" A' g/ S
HTML的基本元素就是这些,怎么样,不太难吧。下一课我们就开始制作完整的HTML文件。好了,下课!如果你有什么地方不明白,就来我“办公室”问吧。 |
|