|
 
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14249
- 金币
- 2415
- 威望
- 1647
- 贡献
- 1363
|
程序编制: x' H$ W9 t k ~" @
随着WEB的发展，与浏览者的交互越来越受到网站制作者的重视。现在的主页跟最初的静态主页相比，界面更加友好，功能更加丰富。这些技术需要一些编程语言来完成，如javascript、VBSCRIPT、CGI、ASP等等。要想使自己的网站在因特网的浩瀚海洋里脱颖而出，就必须掌握这些编程语言。( C6 x: j! D. A/ ` `: ~7 n
经验
" z7 s. e4 M8 |; O( S 经验不是一门技术，却是你制胜的法宝。网站制作中的很多问题，如网站结构、版面安排、中文处理等，都需要你的经验。网上有很多设计优秀的网站，要多学习、借鉴，自己多动手、多尝试，相信你也可以做出引人注目的漂亮网站。 T% }& k3 W# ^6 e0 i% D, k
页面基本元素9 ^5 k# a$ r/ X# |/ Q0 @
HTML的样子( A3 N9 r" R# w- H$ F
HTML语言是由一系列标记组成的，每个标记有它特定的含义。标记用<>标示，以便和页面的内容区分开来。大多数标记成对出现，后面的标记加上一个“/”，表示结束。就像这样：& N) ^" `3 I- [8 } V
这是黑体。: g8 L1 J2 C1 u: }( R' A* b
这句话的显示结果是：
9 Q6 P; @( q$ h+ k) x' _0 |0 t0 e6 y( S 这是黑体。
6 c! N6 x/ S0 {( W 表示黑体开始，表示黑体结束，标记在浏览器里不显示。如果你用过WPS中文处理系统，就会发现HTML的标记和WPS的控制符有点类似。把HTML的各种标记弄清楚，你就是主页制作大师了。简单吗？不一定，我们还是开始学习吧。0 s7 z3 t2 E2 j7 p) W
我的第一页
6 l$ y! J3 ~, p我们首先来看一个最基本的主页的HTML代码：3 Q* X& O2 ?& \+ e( v7 J+ \2 y% ^
7 I3 j1 C' W5 X" D. g
--------------------------------------------------------------------------------7 M- Z, H' M3 m7 b4 w' }
first.html
5 W' X2 j& i. W j这里是页的内容。: y, h+ j7 Z+ z( h
* g% [) I, Z+ [9 e5 r3 |- m; H
--------------------------------------------------------------------------------
1 d( S/ B5 E: i% \, |! R 在“记事本”里输入上面的内容，保存文件，注意把“保存类型”改成所有文件（*.*），输入文件名“first.html”。使用浏览器查看一下结果。0 A8 j; } R8 b' F d- B
图1-1
+ e* h( D+ C% C- X 从浏览器的“查看”-“源代码”菜单项里，我们可以看到我们刚才输入的源代码。
# N# q2 k) h# z0 g0 I7 j' ? 对比源代码和显示结果，我们发现，一个基本的HTML页有以下几部分构成：
1 g3 i: `8 J% R+ a2 X3 A
0 V. j% ?3 j3 } 说明本页面使用HTML语言编写，使浏览器软件能够准确无误地解释、显示。
: q$ |" z( e+ j; S: T; x; x
6 k8 @2 V. n. E: C HTML页头，包含页面的一些设置信息。
* P% X! q! D5 y0 [
9 E3 B& S1 k1 X X0 S d TITLE是HEAD中的重要组成部分，它包含的内容显示在浏览器的窗口标题栏中。如果没有TITLE，浏览器标题栏显示本页的文件名。网上有很多人忽略了TITLE的设置，你可以经常看到UNTITLED或HOME PAGE等这样的默认标题。由于Internet Explorer的收藏夹和Netscape Navigator的书签都是用TITLE作为存储地址文件的标示，所以为你的主页起一个恰当的TITLE是很有必要的。
5 X6 z2 H! X3 h" W4 x
G& d% x, [0 t6 e" [ BODY包含HTML页面的实际内容，显示在浏览器窗口的客户区中。: p# @8 n3 t* f
页头: w# C! _+ J9 d9 G9 Z4 I
除了TITLE标记外，HEAD里还有其他的几个标记。这些标记虽然不常用，但是需要有一定的了解。
" H3 e/ l# S: ]4 z HMETA
8 n$ B+ F( \4 u5 A9 h META标记用于描述不包含在标准HTML里的一些文档信息。激烈的竞争使浏览器厂商纷纷利用META开发出许多实用的功能，又使这些功能在常用的浏览器中都有效。下面介绍几个很有用的用法：2 }' A) f/ }4 X2 Y4 T
! P# Q2 S. y/ L, ?
: _/ d* T) B! l2 y1 O2 z) i 本页的关键字和描述。在页面里加上这些定义后，一些搜索引擎就能够让读者根据这些关键字查找到你的主页，了解你的主页内容。
5 n2 @" k* x% [
; V0 r& J h7 ~0 P 浏览器将在60秒后，自动转到new.htm。你可以利用这个功能，制作一个封面，在若干时间后，自动带读者来到你的目录页。
) O# `6 W1 n3 T 如果URL项没有，浏览器就是刷新本页。这就实现了WWW聊天室定期刷新的特性。: s: v; I5 a- m" e+ L, ?
. b" w! ~' I& }8 W- I 描述本页使用的语言。浏览器根据此项，就可以选择正确的语言编码，而不需要读者自己在浏览器里选择。GB2312是指简体中文，而台湾BIG5内码的主页则是用BIG5。 L8 ^, @9 I1 ~
0 s4 |! l2 t( ?5 C( ]8 v9 x5 T) X 强制性调用网上的最新版本。浏览器为了节约时间，在本地硬盘上保存一个网上文件的临时版本。在你要重新调用时，直接显示硬盘上的文件，而不是网上的。如果你想让读者每次都看到最新的版本，就加上这句话。 `' p: Q V& i' }# C" \. B
LINK
* C2 O# k4 g5 ] 显示本文档和其他文档之间的连接关系。一个最有用的应用就是外部层叠样式表的定位。格式如下：
- c- X) h# o/ }. G5 t6 x0 s
: E& [1 r8 ?9 V9 u9 y# E# p: B REL参数说明两个文档之间的关系，HREF说明目标文档名。关于层叠样式表，将在后面的课程中详述。* G* w5 T, w8 G( G. P
BASE
+ q5 {1 Z# `% v( s8 ^ 本文档的原始地址。语法是：* r5 }( p6 ]. l: P
3 h1 S2 m& Y2 D4 e( p S
这样，读者下载你的文档之后，也可以知道是从哪里下载的。2 a; l! p* |! h3 O! Q
BODY3 ^) j$ i. U4 Z R5 Y9 T) g# H% n
BODY标记有一些属性，用于定义页面内的显示效果。
* J) E/ x1 ?( g1 d4 K ALINK、LINK、TEXT、VLINK—— 文字的颜色。! A- B! m `+ u* ?
ALINK：当前激活的连接的文字颜色。2 p* t: M7 M( B @' |
LINK：连接的文字颜色。# |/ X( t# J. L
TEXT：文字的颜色。
" Z* M+ l1 ~5 t VLINK：参观过的文字颜色。! Y% H6 ^4 @7 y; F
注意：文字的颜色要和背景色有明显的差别，以便读者浏览。1 D' ^# v4 W/ f" h
BACKGROUND、BGPROPERTIES、BGCOLOR——页面的背景部分。
0 k, p/ r8 L5 M+ U: N g [ BACKGROUND：背景图案，该图案在页面内平铺。背景图案应保持单一色调，以保证页面文字易于阅读。
9 }8 V( Y. S7 w! r" ? BGPROPERTIES：设置成FIXED，则背景图案不滚动。（只对INTERNET EXPLORER有效）" c; M. Y- E# B; V4 l
BGCOLOR：背景色。7 u* C: m' a" V4 }6 Z& H: k8 s
注意：如果你的背景图案是深色调，因之文字颜色为淡颜色，那么由于浏览器调用页面的顺序是“背景色-文字-背景图案”，那么在背景图案没有显示的情况下，你的文字在白颜色下很难阅读，所以应该选用一个跟你的背景图案颜色一致的背景色。/ j9 g/ v+ Y* }' Z8 c# q6 s9 @0 w
LEFTMARGIN、TOPMARGIN——页边空白。（只对INTERNET EXPLORER有效）
9 G6 a% |- |% F, ~2 b LEFTMARGIN：左边页边空白。
: O, {* p' a6 y. Q9 z: ~& r( A TOPMARGIN：顶端页边空白。
# ` M; E2 u( d u) k$ l) z HTML的基本元素就是这些，怎么样，不太难吧。下一课我们就开始制作完整的HTML文件。好了，下课！如果你有什么地方不明白，就来我“办公室”问吧。 |
|
发表于 2008-1-19 23:22
| 