|
  
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14443
- 金币
- 2507
- 威望
- 1647
- 贡献
- 1455
|
程序编制
7 f' [4 L3 w( p- u# k; O' c; Z- h7 j 随着WEB的发展,与浏览者的交互越来越受到网站制作者的重视。现在的主页跟最初的静态主页相比,界面更加友好,功能更加丰富。这些技术需要一些编程语言来完成,如javascript、VBSCRIPT、CGI、ASP等等。要想使自己的网站在因特网的浩瀚海洋里脱颖而出,就必须掌握这些编程语言。
/ u3 ^ _# ?% |* e% H 经验1 L {# B" s6 x; X4 @
经验不是一门技术,却是你制胜的法宝。网站制作中的很多问题,如网站结构、版面安排、中文处理等,都需要你的经验。网上有很多设计优秀的网站,要多学习、借鉴,自己多动手、多尝试,相信你也可以做出引人注目的漂亮网站。# K( k; f6 U4 T. L+ A1 V
页面基本元素+ K M3 b7 e9 v8 d4 o- {8 Q4 |
HTML的样子
+ }6 }% [" Q: u( d, f. n3 [ HTML语言是由一系列标记组成的,每个标记有它特定的含义。标记用<>标示,以便和页面的内容区分开来。大多数标记成对出现,后面的标记加上一个“/”,表示结束。就像这样:) K- P% c [0 |
这是黑体。
/ `# H. q( A4 ^5 p. e5 X 这句话的显示结果是:
' o% p4 [( B# y* N 这是黑体。, v3 g$ G+ o5 y
表示黑体开始,表示黑体结束,标记在浏览器里不显示。如果你用过WPS中文处理系统,就会发现HTML的标记和WPS的控制符有点类似。把HTML的各种标记弄清楚,你就是主页制作大师了。简单吗?不一定,我们还是开始学习吧。
% A( ~. y! s: {, ^6 e+ c8 `: P 我的第一页 6 [) p% {4 ]1 [7 X
我们首先来看一个最基本的主页的HTML代码:% s# O1 X w2 r) c0 Q9 c
/ N% u0 V8 E) D& h--------------------------------------------------------------------------------: m) n& D3 {% m! F+ Y3 A$ Z
first.html& ? h) W0 w2 P" Y1 V
这里是页的内容。: i0 X; [5 C" d- p3 {
0 P1 W# e- F) J- x1 X- a* w
--------------------------------------------------------------------------------
% ^: x4 i/ v1 z1 g1 O+ B, p7 K 在“记事本”里输入上面的内容,保存文件,注意把“保存类型”改成所有文件(*.*),输入文件名“first.html”。使用浏览器查看一下结果。+ Y: v5 s- v" d9 b1 [/ b: U" a) x
图1-1
+ w# Q" ]/ P7 L. u# h 从浏览器的“查看”-“源代码”菜单项里,我们可以看到我们刚才输入的源代码。. F) v; V* ^' H. i- L
对比源代码和显示结果,我们发现,一个基本的HTML页有以下几部分构成:
" | Y I. D; e6 |1 E2 Q% m7 C2 r! g2 J8 Y9 E( ~4 u# f
说明本页面使用HTML语言编写,使浏览器软件能够准确无误地解释、显示。7 Z r! m" ?- G; ?, E
5 d* t( F, P* |; e HTML页头,包含页面的一些设置信息。
+ A. e5 `( ]0 n' d9 g- \ N2 y
k# D3 s" e1 V4 t TITLE是HEAD中的重要组成部分,它包含的内容显示在浏览器的窗口标题栏中。如果没有TITLE,浏览器标题栏显示本页的文件名。网上有很多人忽略了TITLE的设置,你可以经常看到UNTITLED或HOME PAGE等这样的默认标题。由于Internet Explorer的收藏夹和Netscape Navigator的书签都是用TITLE作为存储地址文件的标示,所以为你的主页起一个恰当的TITLE是很有必要的。, r' L9 o* W8 |: a4 U. V0 G
4 Z8 C2 D2 T; w; [. e2 T& V2 q
BODY包含HTML页面的实际内容,显示在浏览器窗口的客户区中。3 g T0 U: v. j4 V
页头 i- \2 S+ W$ [& q& r/ R( { ^
除了TITLE标记外,HEAD里还有其他的几个标记。这些标记虽然不常用,但是需要有一定的了解。! I! M9 X H7 E A1 ~9 ~
META
: U0 F, N) W: ]$ Q: s" j/ G META标记用于描述不包含在标准HTML里的一些文档信息。激烈的竞争使浏览器厂商纷纷利用META开发出许多实用的功能,又使这些功能在常用的浏览器中都有效。下面介绍几个很有用的用法:
1 V& x3 t( H' p, F& Q" {! s6 F) L0 u/ z1 G$ N2 A" Y) r
! L, b2 C D0 k- R, Y1 ?& }
本页的关键字和描述。在页面里加上这些定义后,一些搜索引擎就能够让读者根据这些关键字查找到你的主页,了解你的主页内容。; X/ L9 b% `! p( ~) _: g: ~
9 G0 Z. l' \* C& t. s9 D* H( w1 A: B 浏览器将在60秒后,自动转到new.htm。你可以利用这个功能,制作一个封面,在若干时间后,自动带读者来到你的目录页。
2 z) `5 R% P9 w, z e, X 如果URL项没有,浏览器就是刷新本页。这就实现了WWW聊天室定期刷新的特性。
* U; n7 O! p) m K; z# a: b8 d: O
描述本页使用的语言。浏览器根据此项,就可以选择正确的语言编码,而不需要读者自己在浏览器里选择。GB2312是指简体中文,而台湾BIG5内码的主页则是用BIG5。+ U) ]6 m& A: s7 @9 I$ k
6 J0 g }: ~5 |* O# e" ]7 d v
强制性调用网上的最新版本。浏览器为了节约时间,在本地硬盘上保存一个网上文件的临时版本。在你要重新调用时,直接显示硬盘上的文件,而不是网上的。如果你想让读者每次都看到最新的版本,就加上这句话。
1 `+ m; ?: g% FLINK
4 w2 n, p$ z) ~% x2 G 显示本文档和其他文档之间的连接关系。一个最有用的应用就是外部层叠样式表的定位。格式如下:2 o' p5 W3 x* g0 i9 C- ~
( E9 j$ z+ I7 V. p
REL参数说明两个文档之间的关系,HREF说明目标文档名。关于层叠样式表,将在后面的课程中详述。) X; Y" d# `7 b" [6 v& r9 c
BASE
' m4 ?3 x5 b4 v3 n9 j 本文档的原始地址。语法是:
d$ y+ k! h- c2 u1 H$ V; K: u
( s1 p. b; W" A- y% Y 这样,读者下载你的文档之后,也可以知道是从哪里下载的。$ F0 ~" c7 x% Q. F- E) H2 I/ S, U' {
BODY
' r" m* W: x( @* y- M! d! q BODY标记有一些属性,用于定义页面内的显示效果。6 u( A3 F& `- W E$ p* Y4 F
ALINK、LINK、TEXT、VLINK—— 文字的颜色。
: s5 g- C# s- @& ?6 x5 a ALINK:当前激活的连接的文字颜色。
$ X7 u, ?- l1 X/ ?4 t9 L LINK:连接的文字颜色。% v2 e2 \! ^) E$ }# _2 b
TEXT:文字的颜色。% a6 K# z& N1 E- W1 j
VLINK:参观过的文字颜色。0 X' d) N0 [7 b5 ?" I. p4 _
注意:文字的颜色要和背景色有明显的差别,以便读者浏览。. k% C: y1 {+ d; d6 f# ?
BACKGROUND、BGPROPERTIES、BGCOLOR——页面的背景部分。
- z/ E+ R- ~' e; y: u; w+ I BACKGROUND:背景图案,该图案在页面内平铺。背景图案应保持单一色调,以保证页面文字易于阅读。7 s& Y% n1 v$ _
BGPROPERTIES:设置成FIXED,则背景图案不滚动。(只对INTERNET EXPLORER有效)
R, N% }* a' H2 c BGCOLOR:背景色。7 J; W; m: H5 _5 o4 x1 z5 ~) z
注意:如果你的背景图案是深色调,因之文字颜色为淡颜色,那么由于浏览器调用页面的顺序是“背景色-文字-背景图案”,那么在背景图案没有显示的情况下,你的文字在白颜色下很难阅读,所以应该选用一个跟你的背景图案颜色一致的背景色。' X0 ~) p, Y8 K. L8 b0 d: U
LEFTMARGIN、TOPMARGIN——页边空白。(只对INTERNET EXPLORER有效)
9 t/ k r7 Q( M$ ~! p. e- r" y4 n LEFTMARGIN:左边页边空白。
7 F; n4 U* ~; U4 e TOPMARGIN:顶端页边空白。
) G6 l* ~7 B2 X+ Z3 t2 V" \6 L, ] HTML的基本元素就是这些,怎么样,不太难吧。下一课我们就开始制作完整的HTML文件。好了,下课!如果你有什么地方不明白,就来我“办公室”问吧。 |
|