  
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14159
- 金币
- 2370
- 威望
- 1647
- 贡献
- 1318
|
程序编制
* } p$ Z/ a# z/ n 随着WEB的发展,与浏览者的交互越来越受到网站制作者的重视。现在的主页跟最初的静态主页相比,界面更加友好,功能更加丰富。这些技术需要一些编程语言来完成,如javascript、VBSCRIPT、CGI、ASP等等。要想使自己的网站在因特网的浩瀚海洋里脱颖而出,就必须掌握这些编程语言。) m/ I. v2 R# M
经验9 M/ v+ r2 X; [. G
经验不是一门技术,却是你制胜的法宝。网站制作中的很多问题,如网站结构、版面安排、中文处理等,都需要你的经验。网上有很多设计优秀的网站,要多学习、借鉴,自己多动手、多尝试,相信你也可以做出引人注目的漂亮网站。: n4 W( u' P) }: W! T
页面基本元素3 b2 k$ |5 j$ f& W P# \
HTML的样子
* C" V, \- ?" w8 {; }& J HTML语言是由一系列标记组成的,每个标记有它特定的含义。标记用<>标示,以便和页面的内容区分开来。大多数标记成对出现,后面的标记加上一个“/”,表示结束。就像这样:
) D/ n3 |- k: T5 J 这是黑体。7 ]2 Q6 \* T5 n' |
这句话的显示结果是:
]3 b0 Y1 X% A% p 这是黑体。
0 p7 Z3 A$ m8 g1 t- k8 v) a0 Z 表示黑体开始,表示黑体结束,标记在浏览器里不显示。如果你用过WPS中文处理系统,就会发现HTML的标记和WPS的控制符有点类似。把HTML的各种标记弄清楚,你就是主页制作大师了。简单吗?不一定,我们还是开始学习吧。& a& H$ {5 {) ~! B8 l8 J
我的第一页
) S) R% O* M* V' y% y我们首先来看一个最基本的主页的HTML代码:
v+ L/ g& N" {! K. x* V$ h# u% m* D! T$ T& m. h8 x) i
--------------------------------------------------------------------------------9 K1 n/ n) a( r, k. k. k7 [
first.html
$ d! \0 A& r2 l& D8 c9 G这里是页的内容。! ?& p2 g* l: K |
& M; \ n, J) S: ?$ e* v
--------------------------------------------------------------------------------
3 j4 y6 f |+ | 在“记事本”里输入上面的内容,保存文件,注意把“保存类型”改成所有文件(*.*),输入文件名“first.html”。使用浏览器查看一下结果。. V5 ? g: u" S0 l/ X
图1-14 R, g. E4 P" w, F
从浏览器的“查看”-“源代码”菜单项里,我们可以看到我们刚才输入的源代码。
* j7 H' x. S) s. d! L* K 对比源代码和显示结果,我们发现,一个基本的HTML页有以下几部分构成:, B6 u; v# d. J3 w A# C1 l; E7 G3 K
k9 c0 n; J0 L; n' t$ p! J 说明本页面使用HTML语言编写,使浏览器软件能够准确无误地解释、显示。, O. D3 B. d5 S. m5 v* b z4 D/ a
4 G- J* Q, I I) L- {8 a S+ ~; e HTML页头,包含页面的一些设置信息。$ B6 P" `3 T) {+ _- }) E) P- T
/ W. |/ Y, _6 |$ `
TITLE是HEAD中的重要组成部分,它包含的内容显示在浏览器的窗口标题栏中。如果没有TITLE,浏览器标题栏显示本页的文件名。网上有很多人忽略了TITLE的设置,你可以经常看到UNTITLED或HOME PAGE等这样的默认标题。由于Internet Explorer的收藏夹和Netscape Navigator的书签都是用TITLE作为存储地址文件的标示,所以为你的主页起一个恰当的TITLE是很有必要的。
" i M% D7 Y& w0 t
9 B3 \) u7 i, Z/ V/ N BODY包含HTML页面的实际内容,显示在浏览器窗口的客户区中。3 {, n0 j, r# M# ^6 g j( G4 x
页头
& V( k' r9 P$ ~! r6 \4 N( }. E1 i 除了TITLE标记外,HEAD里还有其他的几个标记。这些标记虽然不常用,但是需要有一定的了解。
* k" {* ~1 F6 a3 n& aMETA
7 P4 e2 ~3 w, e8 ?* a- A& o META标记用于描述不包含在标准HTML里的一些文档信息。激烈的竞争使浏览器厂商纷纷利用META开发出许多实用的功能,又使这些功能在常用的浏览器中都有效。下面介绍几个很有用的用法:
1 t) A' @4 J1 Y
& N. x7 q; f+ o: s
' r L. m9 A+ B+ j 本页的关键字和描述。在页面里加上这些定义后,一些搜索引擎就能够让读者根据这些关键字查找到你的主页,了解你的主页内容。* T9 U; `* T! B/ a! H# o
& Q4 l/ {/ C% C- O5 P
浏览器将在60秒后,自动转到new.htm。你可以利用这个功能,制作一个封面,在若干时间后,自动带读者来到你的目录页。5 i) \6 b6 Z, f4 J T5 j: o
如果URL项没有,浏览器就是刷新本页。这就实现了WWW聊天室定期刷新的特性。
' y8 D! }( {2 C7 O
v' w5 g* r9 ~3 K: }9 P 描述本页使用的语言。浏览器根据此项,就可以选择正确的语言编码,而不需要读者自己在浏览器里选择。GB2312是指简体中文,而台湾BIG5内码的主页则是用BIG5。* G6 q, H1 Z( s' P
4 n, K% y0 P5 A; s7 \ 强制性调用网上的最新版本。浏览器为了节约时间,在本地硬盘上保存一个网上文件的临时版本。在你要重新调用时,直接显示硬盘上的文件,而不是网上的。如果你想让读者每次都看到最新的版本,就加上这句话。) Y) ]7 d) M/ Y9 J) b1 M
LINK; u' s9 L1 |$ v: m6 n
显示本文档和其他文档之间的连接关系。一个最有用的应用就是外部层叠样式表的定位。格式如下:& g; K1 L4 y6 m
H! d7 N+ \# r* H
REL参数说明两个文档之间的关系,HREF说明目标文档名。关于层叠样式表,将在后面的课程中详述。
2 b3 j" U& N9 W4 _# o( C* @BASE
# C/ |* i2 P3 _+ k 本文档的原始地址。语法是:7 ]6 B2 R! p! ]# |7 v6 E6 O
1 j' g/ s% G$ k) f9 J$ X 这样,读者下载你的文档之后,也可以知道是从哪里下载的。
1 J4 i5 t' Z$ `" A2 qBODY
4 p' A; q6 M+ v6 h" H% w BODY标记有一些属性,用于定义页面内的显示效果。
; k) i* r/ i3 H ALINK、LINK、TEXT、VLINK—— 文字的颜色。2 L+ N, U) v2 m
ALINK:当前激活的连接的文字颜色。
6 a5 \. L9 [- ^' T6 d LINK:连接的文字颜色。& X2 ]7 `2 [4 P5 \3 B" F
TEXT:文字的颜色。6 u# H) M C2 p
VLINK:参观过的文字颜色。
" g, X4 @! g# H8 T2 o 注意:文字的颜色要和背景色有明显的差别,以便读者浏览。+ h% Z' Q- W* g8 y7 Y. l
BACKGROUND、BGPROPERTIES、BGCOLOR——页面的背景部分。
0 n) Q3 R3 \+ C# D; ?# s BACKGROUND:背景图案,该图案在页面内平铺。背景图案应保持单一色调,以保证页面文字易于阅读。
q3 U) f' U1 V BGPROPERTIES:设置成FIXED,则背景图案不滚动。(只对INTERNET EXPLORER有效)
+ P: R* ~! H: h) {# i- ?. J2 J: ` BGCOLOR:背景色。+ U, u" L! C$ J0 v4 N+ S- U
注意:如果你的背景图案是深色调,因之文字颜色为淡颜色,那么由于浏览器调用页面的顺序是“背景色-文字-背景图案”,那么在背景图案没有显示的情况下,你的文字在白颜色下很难阅读,所以应该选用一个跟你的背景图案颜色一致的背景色。
2 f" e' s8 g' k( ? LEFTMARGIN、TOPMARGIN——页边空白。(只对INTERNET EXPLORER有效)4 a7 Q/ E( C6 g" Y2 l
LEFTMARGIN:左边页边空白。
! j7 U+ Q5 f/ m; ^1 T TOPMARGIN:顶端页边空白。" E3 }+ N7 t" F8 W: j+ b5 C
HTML的基本元素就是这些,怎么样,不太难吧。下一课我们就开始制作完整的HTML文件。好了,下课!如果你有什么地方不明白,就来我“办公室”问吧。 |
|