|
 
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14221
- 金币
- 2401
- 威望
- 1647
- 贡献
- 1349
|
程序编制
" [8 s0 O4 i+ n 随着WEB的发展，与浏览者的交互越来越受到网站制作者的重视。现在的主页跟最初的静态主页相比，界面更加友好，功能更加丰富。这些技术需要一些编程语言来完成，如javascript、VBSCRIPT、CGI、ASP等等。要想使自己的网站在因特网的浩瀚海洋里脱颖而出，就必须掌握这些编程语言。
7 i, A& f/ ~6 H2 I$ g: i! m 经验# `' E Q+ L7 o3 E3 P
经验不是一门技术，却是你制胜的法宝。网站制作中的很多问题，如网站结构、版面安排、中文处理等，都需要你的经验。网上有很多设计优秀的网站，要多学习、借鉴，自己多动手、多尝试，相信你也可以做出引人注目的漂亮网站。% a9 W2 e1 B$ Q# Y/ ^$ d
页面基本元素
) W" Y) }& V! g! N$ I. k" ?7 T HTML的样子: s6 d2 H* E% Q8 Y9 _" Q6 S- t
HTML语言是由一系列标记组成的，每个标记有它特定的含义。标记用<>标示，以便和页面的内容区分开来。大多数标记成对出现，后面的标记加上一个“/”，表示结束。就像这样：7 W' I! C; a% a& ~2 y3 c5 _
这是黑体。) M* x1 f1 p( Z/ U: c! Z3 F( v
这句话的显示结果是：
4 O: x C7 ]- b; ?7 `6 d: x+ f! H 这是黑体。
' Q/ y1 R- @" `/ d$ h- J 表示黑体开始，表示黑体结束，标记在浏览器里不显示。如果你用过WPS中文处理系统，就会发现HTML的标记和WPS的控制符有点类似。把HTML的各种标记弄清楚，你就是主页制作大师了。简单吗？不一定，我们还是开始学习吧。; E; |" j0 E5 ]
我的第一页 ) P6 @) \$ Q$ `
我们首先来看一个最基本的主页的HTML代码：
& g$ m0 K) a5 P, A; g/ O( l0 |5 a& y% N3 _' F
--------------------------------------------------------------------------------' l( d2 G3 l$ h" r2 _" s4 N: B$ u
first.html. }- S5 q1 R1 n7 J. P7 Q
这里是页的内容。 n; B& M7 ?4 N' q' X5 D
: c0 w. p4 V" x1 ^6 @( L a
--------------------------------------------------------------------------------
- \9 z6 P* e3 U) }' z- T* z 在“记事本”里输入上面的内容，保存文件，注意把“保存类型”改成所有文件（*.*），输入文件名“first.html”。使用浏览器查看一下结果。
( c" O) h2 g. k6 ?+ d图1-11 I7 j/ ^6 k- l' A/ |
从浏览器的“查看”-“源代码”菜单项里，我们可以看到我们刚才输入的源代码。
4 o9 f$ C Z2 T 对比源代码和显示结果，我们发现，一个基本的HTML页有以下几部分构成：
4 D+ f% h6 N ]( Q' B
: z5 r) n; ?( f5 Q/ n 说明本页面使用HTML语言编写，使浏览器软件能够准确无误地解释、显示。! j' g i$ T0 ]5 L" p, w1 a) |. I& S6 g3 M
* u7 A4 [7 z, t. G; }+ X0 r
HTML页头，包含页面的一些设置信息。
/ ~/ S9 U- b& d) B2 c* u4 \; c! D- F6 q
TITLE是HEAD中的重要组成部分，它包含的内容显示在浏览器的窗口标题栏中。如果没有TITLE，浏览器标题栏显示本页的文件名。网上有很多人忽略了TITLE的设置，你可以经常看到UNTITLED或HOME PAGE等这样的默认标题。由于Internet Explorer的收藏夹和Netscape Navigator的书签都是用TITLE作为存储地址文件的标示，所以为你的主页起一个恰当的TITLE是很有必要的。
; X. @% h0 I$ H D) Y2 y, `- T, s% B( k5 h# y: B# m
BODY包含HTML页面的实际内容，显示在浏览器窗口的客户区中。/ a f7 t3 @. h/ I" _8 _
页头
1 @! y w7 S7 _$ _/ t9 i: g7 O. u 除了TITLE标记外，HEAD里还有其他的几个标记。这些标记虽然不常用，但是需要有一定的了解。
$ ]- i6 [0 s4 u! qMETA4 w; n# w- y- X" ?7 v9 Y* L& e. o+ U
META标记用于描述不包含在标准HTML里的一些文档信息。激烈的竞争使浏览器厂商纷纷利用META开发出许多实用的功能，又使这些功能在常用的浏览器中都有效。下面介绍几个很有用的用法：
* m5 G3 S5 Y. `5 w5 H# o+ \, F7 [0 O0 u: N! @
5 }8 o+ ?9 r& I 本页的关键字和描述。在页面里加上这些定义后，一些搜索引擎就能够让读者根据这些关键字查找到你的主页，了解你的主页内容。8 H( c4 F% u& t$ M# r$ z: ^
: f! E/ T* L, n3 Y! E
浏览器将在60秒后，自动转到new.htm。你可以利用这个功能，制作一个封面，在若干时间后，自动带读者来到你的目录页。
1 k6 I t7 p' j& t. X9 E 如果URL项没有，浏览器就是刷新本页。这就实现了WWW聊天室定期刷新的特性。
: s. e$ Q$ C$ |$ J
9 r3 s% O, `+ ^& S6 G0 S* o$ Q 描述本页使用的语言。浏览器根据此项，就可以选择正确的语言编码，而不需要读者自己在浏览器里选择。GB2312是指简体中文，而台湾BIG5内码的主页则是用BIG5。
: a8 e5 x; a% t/ ?) A' Y6 f6 o: [
强制性调用网上的最新版本。浏览器为了节约时间，在本地硬盘上保存一个网上文件的临时版本。在你要重新调用时，直接显示硬盘上的文件，而不是网上的。如果你想让读者每次都看到最新的版本，就加上这句话。( M% J# |' O8 u
LINK
8 Y9 F' S8 C7 L 显示本文档和其他文档之间的连接关系。一个最有用的应用就是外部层叠样式表的定位。格式如下：
: T$ l s: d4 U( y1 ^; `& ^ # R0 A$ B; {* ^/ {( {& Q% s9 a
REL参数说明两个文档之间的关系，HREF说明目标文档名。关于层叠样式表，将在后面的课程中详述。# L! L: W8 Y/ z0 J
BASE) p, j1 b- S9 j
本文档的原始地址。语法是：
e1 q, v" Y j% L* l8 P( V9 y( r6 ?/ b
6 w. _$ E1 s3 D 这样，读者下载你的文档之后，也可以知道是从哪里下载的。6 V+ l- p( B8 a8 f
BODY
; M- ~6 O# L Z4 w3 o a BODY标记有一些属性，用于定义页面内的显示效果。2 X& C! v6 \8 A9 \
ALINK、LINK、TEXT、VLINK—— 文字的颜色。
) h: p5 }4 N; U ALINK：当前激活的连接的文字颜色。; T& `. C7 V0 J" I
LINK：连接的文字颜色。
$ u: F* M: j* l! K TEXT：文字的颜色。) w0 ~' L! G8 g! G* n. ]" |
VLINK：参观过的文字颜色。
1 Z( Y7 }2 Y& a7 v 注意：文字的颜色要和背景色有明显的差别，以便读者浏览。
6 j( Q8 L* V$ M! q$ l0 ]5 Q& t BACKGROUND、BGPROPERTIES、BGCOLOR——页面的背景部分。
* F, E- D F1 s6 S# }- F BACKGROUND：背景图案，该图案在页面内平铺。背景图案应保持单一色调，以保证页面文字易于阅读。3 B0 g. `* }( B, _
BGPROPERTIES：设置成FIXED，则背景图案不滚动。（只对INTERNET EXPLORER有效）
" ]' R& c q" G. {1 \5 ? BGCOLOR：背景色。
& Q8 s& H& g( W. d( k( q) Z5 E& N: } 注意：如果你的背景图案是深色调，因之文字颜色为淡颜色，那么由于浏览器调用页面的顺序是“背景色-文字-背景图案”，那么在背景图案没有显示的情况下，你的文字在白颜色下很难阅读，所以应该选用一个跟你的背景图案颜色一致的背景色。- O! G2 @* J6 A
LEFTMARGIN、TOPMARGIN——页边空白。（只对INTERNET EXPLORER有效）& b5 v$ B/ N- _) q0 I& c
LEFTMARGIN：左边页边空白。
% q# D& `( e6 d, L( _ TOPMARGIN：顶端页边空白。# G/ y c- n- b$ y( m9 ?
HTML的基本元素就是这些，怎么样，不太难吧。下一课我们就开始制作完整的HTML文件。好了，下课！如果你有什么地方不明白，就来我“办公室”问吧。 |
|
发表于 2008-1-19 23:22
| 