|
 
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14197
- 金币
- 2389
- 威望
- 1647
- 贡献
- 1337
|
程序编制' _1 o6 f% x6 v" [6 x6 R
随着WEB的发展，与浏览者的交互越来越受到网站制作者的重视。现在的主页跟最初的静态主页相比，界面更加友好，功能更加丰富。这些技术需要一些编程语言来完成，如javascript、VBSCRIPT、CGI、ASP等等。要想使自己的网站在因特网的浩瀚海洋里脱颖而出，就必须掌握这些编程语言。
, G+ C* D+ t1 [7 b 经验3 ?" ?- Z& v& U% }
经验不是一门技术，却是你制胜的法宝。网站制作中的很多问题，如网站结构、版面安排、中文处理等，都需要你的经验。网上有很多设计优秀的网站，要多学习、借鉴，自己多动手、多尝试，相信你也可以做出引人注目的漂亮网站。) D, w) T! B' a. m4 T8 b
页面基本元素! W2 o2 {) [4 u; C/ \ ^
HTML的样子3 r5 ? H V# D* e6 Y6 t
HTML语言是由一系列标记组成的，每个标记有它特定的含义。标记用<>标示，以便和页面的内容区分开来。大多数标记成对出现，后面的标记加上一个“/”，表示结束。就像这样：
: U% p# T& K; m. o9 l 这是黑体。
. O2 G8 b5 X$ Q" b 这句话的显示结果是：
( l' g+ x6 k6 X' g 这是黑体。
& u+ F ]" r% _! y: O" ^ 表示黑体开始，表示黑体结束，标记在浏览器里不显示。如果你用过WPS中文处理系统，就会发现HTML的标记和WPS的控制符有点类似。把HTML的各种标记弄清楚，你就是主页制作大师了。简单吗？不一定，我们还是开始学习吧。+ j" g; E9 S: d6 \
我的第一页
$ ~4 {/ K& d: P7 j我们首先来看一个最基本的主页的HTML代码：
: R# v1 z Y( [6 }
# a# I# L# E r. x" @+ l--------------------------------------------------------------------------------
- \, u+ Y, K; u( g7 _first.html
5 |2 g c l A' s2 y这里是页的内容。
1 ]1 }/ Z: `' J5 @9 @
' E$ [1 F$ L9 S; r/ W--------------------------------------------------------------------------------% \3 D( _6 W; t8 t
在“记事本”里输入上面的内容，保存文件，注意把“保存类型”改成所有文件（*.*），输入文件名“first.html”。使用浏览器查看一下结果。
6 s8 E: j1 L; {7 f. B+ L图1-1
$ w" c6 g( g) D9 { 从浏览器的“查看”-“源代码”菜单项里，我们可以看到我们刚才输入的源代码。
9 o6 i& J/ s& d0 z+ R3 {/ W* k: l 对比源代码和显示结果，我们发现，一个基本的HTML页有以下几部分构成：" k* H, |5 K0 q! \* O0 ?9 [
( V! g7 G- C2 m8 {) ? 说明本页面使用HTML语言编写，使浏览器软件能够准确无误地解释、显示。, Q. \2 o/ H' E6 X
2 c$ S0 h: m! K2 h# q0 {
HTML页头，包含页面的一些设置信息。
0 t: m, O) f; ?. ~7 L8 E: T! Z( q/ u4 C, b; c9 } B' c7 W' X, t
TITLE是HEAD中的重要组成部分，它包含的内容显示在浏览器的窗口标题栏中。如果没有TITLE，浏览器标题栏显示本页的文件名。网上有很多人忽略了TITLE的设置，你可以经常看到UNTITLED或HOME PAGE等这样的默认标题。由于Internet Explorer的收藏夹和Netscape Navigator的书签都是用TITLE作为存储地址文件的标示，所以为你的主页起一个恰当的TITLE是很有必要的。: {/ ]7 f* X, U) I2 \
. q; d: `0 J, M9 w) _ BODY包含HTML页面的实际内容，显示在浏览器窗口的客户区中。- c/ k" w1 z4 I6 o" J
页头9 n2 f3 K+ c# ]* F( c5 i/ _
除了TITLE标记外，HEAD里还有其他的几个标记。这些标记虽然不常用，但是需要有一定的了解。; v3 c6 z; h8 S7 O F1 b) E
META E- O+ m- U7 k3 Z3 m
META标记用于描述不包含在标准HTML里的一些文档信息。激烈的竞争使浏览器厂商纷纷利用META开发出许多实用的功能，又使这些功能在常用的浏览器中都有效。下面介绍几个很有用的用法：
, c4 A& d5 j8 A& N* j% I8 F3 o6 x# L: N4 C" a
, _$ a' B. \$ `9 @& R8 @3 `2 ] 本页的关键字和描述。在页面里加上这些定义后，一些搜索引擎就能够让读者根据这些关键字查找到你的主页，了解你的主页内容。- H4 U1 H' k, s3 J( B4 J8 K, `
. o2 F/ G' k+ f# ^) t0 J+ ?3 }- R9 G 浏览器将在60秒后，自动转到new.htm。你可以利用这个功能，制作一个封面，在若干时间后，自动带读者来到你的目录页。
1 L/ Q5 l) U7 i& W! E! V0 [* g7 G 如果URL项没有，浏览器就是刷新本页。这就实现了WWW聊天室定期刷新的特性。
4 K( E6 v+ U8 p9 @- g3 T4 z6 }! x( A% Z- }+ X& e
描述本页使用的语言。浏览器根据此项，就可以选择正确的语言编码，而不需要读者自己在浏览器里选择。GB2312是指简体中文，而台湾BIG5内码的主页则是用BIG5。/ @3 \" T9 k' n+ F _" L
- r p- ^4 _- U
强制性调用网上的最新版本。浏览器为了节约时间，在本地硬盘上保存一个网上文件的临时版本。在你要重新调用时，直接显示硬盘上的文件，而不是网上的。如果你想让读者每次都看到最新的版本，就加上这句话。+ x$ m8 S# m0 c- e2 a3 E( r3 P
LINK, G7 D. W. M3 [( |7 z6 }" @
显示本文档和其他文档之间的连接关系。一个最有用的应用就是外部层叠样式表的定位。格式如下：; M( P; ~7 ?7 C: i
/ T4 g; M# i$ D5 U) N
REL参数说明两个文档之间的关系，HREF说明目标文档名。关于层叠样式表，将在后面的课程中详述。1 x, p& a" \; ?) Z2 G! Q! i
BASE
c7 n2 U1 ^, J 本文档的原始地址。语法是：1 A5 K8 h$ `( ]2 i2 d
8 {7 Z) i! r. \' V4 e 这样，读者下载你的文档之后，也可以知道是从哪里下载的。 q0 R: Y' H5 h. ?" e
BODY
& r# d8 X7 G' X. C- h BODY标记有一些属性，用于定义页面内的显示效果。) X l3 q, P* Z
ALINK、LINK、TEXT、VLINK—— 文字的颜色。
' c: `9 n3 y p- B& b! t ALINK：当前激活的连接的文字颜色。
! g! w5 [% F3 s0 R LINK：连接的文字颜色。
! k! F4 t- ]! \. B TEXT：文字的颜色。
2 J O4 T% K4 [- J' r9 s# ] VLINK：参观过的文字颜色。$ D, o% u& Z ?0 @, h+ c- F
注意：文字的颜色要和背景色有明显的差别，以便读者浏览。$ Q' q* y7 n- G8 n2 x8 l5 z
BACKGROUND、BGPROPERTIES、BGCOLOR——页面的背景部分。
9 i# `$ m5 L/ i' D% P4 U BACKGROUND：背景图案，该图案在页面内平铺。背景图案应保持单一色调，以保证页面文字易于阅读。1 @8 X+ ?4 Q7 F! s4 ~ `
BGPROPERTIES：设置成FIXED，则背景图案不滚动。（只对INTERNET EXPLORER有效）9 S% w, K1 m' ?3 x
BGCOLOR：背景色。
; |- K8 O8 g6 K0 E1 X, i" E1 p 注意：如果你的背景图案是深色调，因之文字颜色为淡颜色，那么由于浏览器调用页面的顺序是“背景色-文字-背景图案”，那么在背景图案没有显示的情况下，你的文字在白颜色下很难阅读，所以应该选用一个跟你的背景图案颜色一致的背景色。( m" ^6 Y; L c% u. k5 o* E
LEFTMARGIN、TOPMARGIN——页边空白。（只对INTERNET EXPLORER有效）
: E2 w: `: M/ ] e( x: a LEFTMARGIN：左边页边空白。
4 H; N4 V6 W. X! l B TOPMARGIN：顶端页边空白。
% p1 ^& M9 f( b6 S6 z HTML的基本元素就是这些，怎么样，不太难吧。下一课我们就开始制作完整的HTML文件。好了，下课！如果你有什么地方不明白，就来我“办公室”问吧。 |
|
发表于 2008-1-19 23:22
| 