|
 
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14221
- 金币
- 2401
- 威望
- 1647
- 贡献
- 1349
|
程序编制9 I8 f Y4 v7 d. g8 W" r
随着WEB的发展，与浏览者的交互越来越受到网站制作者的重视。现在的主页跟最初的静态主页相比，界面更加友好，功能更加丰富。这些技术需要一些编程语言来完成，如javascript、VBSCRIPT、CGI、ASP等等。要想使自己的网站在因特网的浩瀚海洋里脱颖而出，就必须掌握这些编程语言。
: B2 B6 p2 D- @: D3 Z! M 经验
0 |# ?2 U; y; Z, z1 [& Q% s 经验不是一门技术，却是你制胜的法宝。网站制作中的很多问题，如网站结构、版面安排、中文处理等，都需要你的经验。网上有很多设计优秀的网站，要多学习、借鉴，自己多动手、多尝试，相信你也可以做出引人注目的漂亮网站。7 T2 I' c; i1 J8 R: M$ C
页面基本元素- @$ v+ x+ I7 d
HTML的样子' x# x5 w) _ k3 {' w
HTML语言是由一系列标记组成的，每个标记有它特定的含义。标记用<>标示，以便和页面的内容区分开来。大多数标记成对出现，后面的标记加上一个“/”，表示结束。就像这样：
2 Z" I B6 ]3 _ 这是黑体。
" T8 ], L; ]' D3 w- A 这句话的显示结果是：
q* i8 y6 y* H+ y/ w: v 这是黑体。1 ], X& f P9 q9 d- h5 ~( e1 z! t- h
表示黑体开始，表示黑体结束，标记在浏览器里不显示。如果你用过WPS中文处理系统，就会发现HTML的标记和WPS的控制符有点类似。把HTML的各种标记弄清楚，你就是主页制作大师了。简单吗？不一定，我们还是开始学习吧。
7 h- ]+ I) d! y 我的第一页
( O" A1 Q# k2 h! I) I1 R$ l) K我们首先来看一个最基本的主页的HTML代码：* M% i( t9 |+ A" r$ z, \( v) e
9 F& B# D( n" R5 m5 W
--------------------------------------------------------------------------------
0 `- ?: f5 t9 Y. O% N! x! E5 ]% ~5 mfirst.html
) k& d X- k' c0 d" L* d$ B这里是页的内容。# V% j2 X" t) f; |9 f7 e
( r/ {8 ?: r( z8 T. N- R3 Y- f-------------------------------------------------------------------------------- J6 }0 t1 N, w; L+ L+ d
在“记事本”里输入上面的内容，保存文件，注意把“保存类型”改成所有文件（*.*），输入文件名“first.html”。使用浏览器查看一下结果。: N9 ?# G" {8 P; A6 P' v: m0 Q% Y: S
图1-1: J. @+ u4 p; N1 l
从浏览器的“查看”-“源代码”菜单项里，我们可以看到我们刚才输入的源代码。
- y, G7 j4 x. N/ I$ L 对比源代码和显示结果，我们发现，一个基本的HTML页有以下几部分构成：8 b, m( O B, p5 W) r
2 z9 y; D; U4 j 说明本页面使用HTML语言编写，使浏览器软件能够准确无误地解释、显示。! M7 O* C3 u- b) h$ w6 w
( E% \9 F; b, p HTML页头，包含页面的一些设置信息。* B; M' |( a2 @. X2 T. ]9 \
& f& C6 o; {4 Z2 t% ^5 A TITLE是HEAD中的重要组成部分，它包含的内容显示在浏览器的窗口标题栏中。如果没有TITLE，浏览器标题栏显示本页的文件名。网上有很多人忽略了TITLE的设置，你可以经常看到UNTITLED或HOME PAGE等这样的默认标题。由于Internet Explorer的收藏夹和Netscape Navigator的书签都是用TITLE作为存储地址文件的标示，所以为你的主页起一个恰当的TITLE是很有必要的。" M/ \0 K$ ~5 b- l$ O6 u/ I
8 n8 Y# d0 q5 s, E. o e) Z& \ BODY包含HTML页面的实际内容，显示在浏览器窗口的客户区中。% S0 r, H8 p, _1 k4 _+ X# r/ G
页头; G4 h9 b$ l9 m {0 S" F; q
除了TITLE标记外，HEAD里还有其他的几个标记。这些标记虽然不常用，但是需要有一定的了解。/ C7 T) D; q9 R; Q: C
META
4 U! w1 M/ N. L0 K; }6 Y+ w META标记用于描述不包含在标准HTML里的一些文档信息。激烈的竞争使浏览器厂商纷纷利用META开发出许多实用的功能，又使这些功能在常用的浏览器中都有效。下面介绍几个很有用的用法：
- z% ~# {$ n9 M. g# v0 E/ z2 Y/ r3 ]5 G0 x( F* V+ x
1 ]9 B% s" q+ Z6 [
本页的关键字和描述。在页面里加上这些定义后，一些搜索引擎就能够让读者根据这些关键字查找到你的主页，了解你的主页内容。
+ _; e9 X6 S) q: A& S/ W
6 A& g5 |' R" R 浏览器将在60秒后，自动转到new.htm。你可以利用这个功能，制作一个封面，在若干时间后，自动带读者来到你的目录页。
' e6 {; @0 |4 A5 Z. C; D( x 如果URL项没有，浏览器就是刷新本页。这就实现了WWW聊天室定期刷新的特性。
! O( m1 `, m$ h3 A2 A& D+ k# H: a+ d- d7 P: ?/ p
描述本页使用的语言。浏览器根据此项，就可以选择正确的语言编码，而不需要读者自己在浏览器里选择。GB2312是指简体中文，而台湾BIG5内码的主页则是用BIG5。
. k9 `0 N7 O+ \& b
" v7 b1 ] T7 Z8 _7 P 强制性调用网上的最新版本。浏览器为了节约时间，在本地硬盘上保存一个网上文件的临时版本。在你要重新调用时，直接显示硬盘上的文件，而不是网上的。如果你想让读者每次都看到最新的版本，就加上这句话。: d8 f3 \5 D, r
LINK1 w) O5 W2 I, T+ F) w
显示本文档和其他文档之间的连接关系。一个最有用的应用就是外部层叠样式表的定位。格式如下：
, V# c5 T, x- r
; T$ m7 A0 k0 T( _+ A2 [: [- X REL参数说明两个文档之间的关系，HREF说明目标文档名。关于层叠样式表，将在后面的课程中详述。
2 w+ @* y5 K2 Z/ t& e* o$ IBASE7 C* P4 @# x. z1 q
本文档的原始地址。语法是：- M) D6 B( {' N5 s$ ?+ J) o
$ N+ k4 E2 }* g! ]
这样，读者下载你的文档之后，也可以知道是从哪里下载的。) _0 |& X+ D& Q; U- k6 s
BODY- [, t |) K- `1 S0 ^
BODY标记有一些属性，用于定义页面内的显示效果。
z) |3 Z( n% V9 t* Z7 }7 k ALINK、LINK、TEXT、VLINK—— 文字的颜色。0 I+ w' ]/ y" d/ @/ _
ALINK：当前激活的连接的文字颜色。, K' ]+ b/ w: a3 b; G( r
LINK：连接的文字颜色。6 X& O. ~8 L* g. t' _1 C, L
TEXT：文字的颜色。
% k% P# ]! r# A VLINK：参观过的文字颜色。/ F- A5 I, l9 M0 \
注意：文字的颜色要和背景色有明显的差别，以便读者浏览。; D. A, {0 d* U* V) I/ D
BACKGROUND、BGPROPERTIES、BGCOLOR——页面的背景部分。6 v) c# p- _: u+ B
BACKGROUND：背景图案，该图案在页面内平铺。背景图案应保持单一色调，以保证页面文字易于阅读。
' x2 |4 y" U* [" N, R BGPROPERTIES：设置成FIXED，则背景图案不滚动。（只对INTERNET EXPLORER有效）3 r1 L- j/ R Z5 \) R2 V
BGCOLOR：背景色。
: u' t z+ c$ {& N8 ^$ F, N6 S 注意：如果你的背景图案是深色调，因之文字颜色为淡颜色，那么由于浏览器调用页面的顺序是“背景色-文字-背景图案”，那么在背景图案没有显示的情况下，你的文字在白颜色下很难阅读，所以应该选用一个跟你的背景图案颜色一致的背景色。* i0 k( V3 x; Q8 g
LEFTMARGIN、TOPMARGIN——页边空白。（只对INTERNET EXPLORER有效）" m- a' ~4 f0 N7 K6 b
LEFTMARGIN：左边页边空白。0 v* d n( f2 g% r$ Z* s
TOPMARGIN：顶端页边空白。$ V/ d% v; n0 ]1 U Y5 P* Z! n( |, ?) `
HTML的基本元素就是这些，怎么样，不太难吧。下一课我们就开始制作完整的HTML文件。好了，下课！如果你有什么地方不明白，就来我“办公室”问吧。 |
|
发表于 2008-1-19 23:22
| 