|
 
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14221
- 金币
- 2401
- 威望
- 1647
- 贡献
- 1349
|
程序编制
0 O1 N* l' O" p" {2 U 随着WEB的发展，与浏览者的交互越来越受到网站制作者的重视。现在的主页跟最初的静态主页相比，界面更加友好，功能更加丰富。这些技术需要一些编程语言来完成，如javascript、VBSCRIPT、CGI、ASP等等。要想使自己的网站在因特网的浩瀚海洋里脱颖而出，就必须掌握这些编程语言。
. v; f3 c4 Y* `( @$ k3 l/ j9 N 经验
6 T" P1 M/ G! f6 e 经验不是一门技术，却是你制胜的法宝。网站制作中的很多问题，如网站结构、版面安排、中文处理等，都需要你的经验。网上有很多设计优秀的网站，要多学习、借鉴，自己多动手、多尝试，相信你也可以做出引人注目的漂亮网站。
. k1 ^" j" F, o) c3 V 页面基本元素 b U& |2 z! U* \- |: @5 n4 F1 b
HTML的样子" `0 C- Z/ b N; m/ Q
HTML语言是由一系列标记组成的，每个标记有它特定的含义。标记用<>标示，以便和页面的内容区分开来。大多数标记成对出现，后面的标记加上一个“/”，表示结束。就像这样： E2 ~9 r, M6 c! g7 w* j
这是黑体。
" j9 o, O+ O5 f2 t/ K 这句话的显示结果是：( u3 O) a! E: N. s0 Z- A
这是黑体。
7 E2 j$ M5 L: ?* g 表示黑体开始，表示黑体结束，标记在浏览器里不显示。如果你用过WPS中文处理系统，就会发现HTML的标记和WPS的控制符有点类似。把HTML的各种标记弄清楚，你就是主页制作大师了。简单吗？不一定，我们还是开始学习吧。( E; _1 B' l) z0 I5 b! j
我的第一页
& u7 ]8 V# w& ~* g0 {5 D我们首先来看一个最基本的主页的HTML代码：
' a0 R" u8 x* Y" Q+ a% @- V; z6 m2 r1 Q! F1 Z* H" X
--------------------------------------------------------------------------------
9 M3 Q7 M; |- Y& sfirst.html1 X$ C' y8 a3 c: A" W: O) |
这里是页的内容。
6 w8 r" o7 h# [0 M9 p
. H: t1 n5 W+ X) v. Q--------------------------------------------------------------------------------
h( {' @4 {8 Y 在“记事本”里输入上面的内容，保存文件，注意把“保存类型”改成所有文件（*.*），输入文件名“first.html”。使用浏览器查看一下结果。0 @0 N: m0 D7 m& o) V' e
图1-1
) [% A9 O, f0 r+ w# ?9 ?2 n 从浏览器的“查看”-“源代码”菜单项里，我们可以看到我们刚才输入的源代码。% _4 y$ w( J! g7 I3 F5 W- b: t& o
对比源代码和显示结果，我们发现，一个基本的HTML页有以下几部分构成：
+ T) n5 h7 e3 \6 m& r$ C% Q/ v& N9 N6 Q! O, b) \6 I
说明本页面使用HTML语言编写，使浏览器软件能够准确无误地解释、显示。( J# l9 k k9 Q% Y* g; n# t+ C
- V3 T! E7 _8 ?0 c) M2 d
HTML页头，包含页面的一些设置信息。0 `: X* `# Y: y" K. y
0 B3 N1 P$ M/ p* U N
TITLE是HEAD中的重要组成部分，它包含的内容显示在浏览器的窗口标题栏中。如果没有TITLE，浏览器标题栏显示本页的文件名。网上有很多人忽略了TITLE的设置，你可以经常看到UNTITLED或HOME PAGE等这样的默认标题。由于Internet Explorer的收藏夹和Netscape Navigator的书签都是用TITLE作为存储地址文件的标示，所以为你的主页起一个恰当的TITLE是很有必要的。
' [9 N( r3 a E- p2 R% [8 O+ Q. x! J
9 ?/ \6 |6 \) X BODY包含HTML页面的实际内容，显示在浏览器窗口的客户区中。
: A# L( S( d6 S. x' W/ ? 页头% C8 ?$ V M; U4 E6 A2 ^6 d
除了TITLE标记外，HEAD里还有其他的几个标记。这些标记虽然不常用，但是需要有一定的了解。
4 j, S* [. u" tMETA2 P. W/ z4 U: a, @( |; v
META标记用于描述不包含在标准HTML里的一些文档信息。激烈的竞争使浏览器厂商纷纷利用META开发出许多实用的功能，又使这些功能在常用的浏览器中都有效。下面介绍几个很有用的用法：. c* @1 z6 T4 z
. o* ?9 a9 Y2 H5 X4 ?) j) K) u
0 R5 `) u \- | 本页的关键字和描述。在页面里加上这些定义后，一些搜索引擎就能够让读者根据这些关键字查找到你的主页，了解你的主页内容。2 [: Z& b; r) p: h. z% _) L. U; `
/ e' }% u7 {% g& | a& k: N 浏览器将在60秒后，自动转到new.htm。你可以利用这个功能，制作一个封面，在若干时间后，自动带读者来到你的目录页。
( h* m9 c/ Z4 ]- L7 |/ Q; L6 _, u 如果URL项没有，浏览器就是刷新本页。这就实现了WWW聊天室定期刷新的特性。1 }8 u4 Z# [( m/ i$ a
9 U l$ [; X2 s
描述本页使用的语言。浏览器根据此项，就可以选择正确的语言编码，而不需要读者自己在浏览器里选择。GB2312是指简体中文，而台湾BIG5内码的主页则是用BIG5。1 Y! {4 \" \, u% K4 k) e
8 A3 k" F/ ]; i0 p, m3 L1 V
强制性调用网上的最新版本。浏览器为了节约时间，在本地硬盘上保存一个网上文件的临时版本。在你要重新调用时，直接显示硬盘上的文件，而不是网上的。如果你想让读者每次都看到最新的版本，就加上这句话。
# S" Z4 j7 _( W$ rLINK
7 c6 c% N- q! R 显示本文档和其他文档之间的连接关系。一个最有用的应用就是外部层叠样式表的定位。格式如下：" X6 D: M. R0 A3 |8 I. b' [
+ T! w1 F6 d% ~! v* P4 z2 {! N; Q REL参数说明两个文档之间的关系，HREF说明目标文档名。关于层叠样式表，将在后面的课程中详述。0 L& r: k7 X4 I: A! b& B( x
BASE
1 l/ u- p, {" M 本文档的原始地址。语法是：
1 U! d; m/ Y4 d0 e
& m# [ F9 O4 F: s1 R 这样，读者下载你的文档之后，也可以知道是从哪里下载的。
' g. r- O8 \- {6 fBODY% I% w8 [ F: @7 T- Q# h
BODY标记有一些属性，用于定义页面内的显示效果。
1 S A0 I3 M/ W9 }7 k, W, O- T ALINK、LINK、TEXT、VLINK—— 文字的颜色。9 g/ x% D6 ] l6 E: B) @ X& [
ALINK：当前激活的连接的文字颜色。- y" }0 P, L M: A# _
LINK：连接的文字颜色。
( U$ e: X* J4 a* f) u; G( b/ ? TEXT：文字的颜色。
" C: x+ x8 r% e VLINK：参观过的文字颜色。
: O9 o4 q+ W& y 注意：文字的颜色要和背景色有明显的差别，以便读者浏览。
, \; |% y& f. } BACKGROUND、BGPROPERTIES、BGCOLOR——页面的背景部分。
K. y7 j% ~) P: U+ t/ d) v BACKGROUND：背景图案，该图案在页面内平铺。背景图案应保持单一色调，以保证页面文字易于阅读。( X, e9 S6 l; Y. d6 J
BGPROPERTIES：设置成FIXED，则背景图案不滚动。（只对INTERNET EXPLORER有效）1 Q9 ?3 N. N, [1 q Y; U. m
BGCOLOR：背景色。. g' ~% i H: o, J3 d6 ]: H9 E
注意：如果你的背景图案是深色调，因之文字颜色为淡颜色，那么由于浏览器调用页面的顺序是“背景色-文字-背景图案”，那么在背景图案没有显示的情况下，你的文字在白颜色下很难阅读，所以应该选用一个跟你的背景图案颜色一致的背景色。
; A( ]1 }+ v0 L2 v4 F LEFTMARGIN、TOPMARGIN——页边空白。（只对INTERNET EXPLORER有效）
) q0 N, U6 j- R3 L( C LEFTMARGIN：左边页边空白。6 _ p$ b7 ^( g
TOPMARGIN：顶端页边空白。8 y6 A; N- m m) Q, P9 w; ~- n
HTML的基本元素就是这些，怎么样，不太难吧。下一课我们就开始制作完整的HTML文件。好了，下课！如果你有什么地方不明白，就来我“办公室”问吧。 |
|
发表于 2008-1-19 23:22
| 