|
  
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14443
- 金币
- 2507
- 威望
- 1647
- 贡献
- 1455
|
程序编制
. {/ W/ t' w/ c8 } 随着WEB的发展,与浏览者的交互越来越受到网站制作者的重视。现在的主页跟最初的静态主页相比,界面更加友好,功能更加丰富。这些技术需要一些编程语言来完成,如javascript、VBSCRIPT、CGI、ASP等等。要想使自己的网站在因特网的浩瀚海洋里脱颖而出,就必须掌握这些编程语言。3 J8 u1 O( S8 u z* Z# e2 m
经验& N) M, d7 @+ _* U& d, R0 V2 U8 V3 `
经验不是一门技术,却是你制胜的法宝。网站制作中的很多问题,如网站结构、版面安排、中文处理等,都需要你的经验。网上有很多设计优秀的网站,要多学习、借鉴,自己多动手、多尝试,相信你也可以做出引人注目的漂亮网站。
3 g) I, a. \7 u: p 页面基本元素
9 s) j7 S4 E t* T! F) m HTML的样子
5 _9 p, B7 W8 H0 l- Q1 ^6 h% D HTML语言是由一系列标记组成的,每个标记有它特定的含义。标记用<>标示,以便和页面的内容区分开来。大多数标记成对出现,后面的标记加上一个“/”,表示结束。就像这样:6 K, v/ T' T D" P1 [
这是黑体。
4 t2 Q4 J2 b; D5 S+ w 这句话的显示结果是:
9 `0 q. \: v6 h0 G9 m 这是黑体。
" t. o2 y; Y/ M7 t, `) ?& E 表示黑体开始,表示黑体结束,标记在浏览器里不显示。如果你用过WPS中文处理系统,就会发现HTML的标记和WPS的控制符有点类似。把HTML的各种标记弄清楚,你就是主页制作大师了。简单吗?不一定,我们还是开始学习吧。
5 y8 y" O& v8 i9 _; c3 c$ F 我的第一页 ) [1 r) ]( c5 q) u/ P7 y4 o
我们首先来看一个最基本的主页的HTML代码:
5 s( r/ ^2 i, v
, G# m, Q- u) N6 T--------------------------------------------------------------------------------
' Q( ^4 `: h; R6 `+ |( dfirst.html
4 w! y9 ?0 j$ h; n$ q& X' H2 D这里是页的内容。
3 u1 S6 v% |: n R( F) u6 A6 w2 y; i1 q" C1 T: h, y9 d5 p
--------------------------------------------------------------------------------0 @; [ E# @9 p* `: j0 ^
在“记事本”里输入上面的内容,保存文件,注意把“保存类型”改成所有文件(*.*),输入文件名“first.html”。使用浏览器查看一下结果。
* U) y: b3 x* }图1-1
% ~) q8 h$ c: w& ?8 X; R% }# l 从浏览器的“查看”-“源代码”菜单项里,我们可以看到我们刚才输入的源代码。+ ?6 z. w1 Z% d: T T
对比源代码和显示结果,我们发现,一个基本的HTML页有以下几部分构成:
, X9 z0 U2 h2 }
6 w- i& p; ^- M0 i' K 说明本页面使用HTML语言编写,使浏览器软件能够准确无误地解释、显示。6 ]2 R1 G& z$ {5 o
3 E% m8 n+ p( A/ M7 D" O HTML页头,包含页面的一些设置信息。8 O9 [4 X( O7 S: }- Q- {7 \- U4 a
' K# Y6 }, W( t
TITLE是HEAD中的重要组成部分,它包含的内容显示在浏览器的窗口标题栏中。如果没有TITLE,浏览器标题栏显示本页的文件名。网上有很多人忽略了TITLE的设置,你可以经常看到UNTITLED或HOME PAGE等这样的默认标题。由于Internet Explorer的收藏夹和Netscape Navigator的书签都是用TITLE作为存储地址文件的标示,所以为你的主页起一个恰当的TITLE是很有必要的。( Y6 Q3 H% E7 r. I3 g* j
* `* U2 d" ?& A2 d( M- y# w BODY包含HTML页面的实际内容,显示在浏览器窗口的客户区中。) x' ]9 O1 S% U; _4 C5 @+ U5 e
页头# F3 Z! C$ m, s" e: W/ S$ z
除了TITLE标记外,HEAD里还有其他的几个标记。这些标记虽然不常用,但是需要有一定的了解。7 d% A) ] ~* }& `
META5 E8 I- L0 {5 E- B. S) [6 x" @) _
META标记用于描述不包含在标准HTML里的一些文档信息。激烈的竞争使浏览器厂商纷纷利用META开发出许多实用的功能,又使这些功能在常用的浏览器中都有效。下面介绍几个很有用的用法:
* D$ y! e! G, Y( t, W
4 H7 U: n4 [4 R+ y3 A2 |: m8 n
: L" S5 ~: c, v6 |( a/ ^$ m 本页的关键字和描述。在页面里加上这些定义后,一些搜索引擎就能够让读者根据这些关键字查找到你的主页,了解你的主页内容。. ~9 F7 L7 n0 {5 G+ c2 H. }- G
5 u$ Y" y! g7 x6 l; z* w# P
浏览器将在60秒后,自动转到new.htm。你可以利用这个功能,制作一个封面,在若干时间后,自动带读者来到你的目录页。! n# D7 o1 p. J" w, c* c1 g
如果URL项没有,浏览器就是刷新本页。这就实现了WWW聊天室定期刷新的特性。( K/ y5 u8 `" b+ A! R/ f: R
% ~' o. N5 g- d* B 描述本页使用的语言。浏览器根据此项,就可以选择正确的语言编码,而不需要读者自己在浏览器里选择。GB2312是指简体中文,而台湾BIG5内码的主页则是用BIG5。
% A# \$ T. v" [& ? m, X6 x' o
- ^- o, Y; ~8 C/ s; g) o 强制性调用网上的最新版本。浏览器为了节约时间,在本地硬盘上保存一个网上文件的临时版本。在你要重新调用时,直接显示硬盘上的文件,而不是网上的。如果你想让读者每次都看到最新的版本,就加上这句话。
/ S" K4 l4 Y* f( ]5 ZLINK( J# c; [- i+ C1 u) n" {6 {# _
显示本文档和其他文档之间的连接关系。一个最有用的应用就是外部层叠样式表的定位。格式如下:
3 v5 H; q7 g% j' U7 }: k4 [
( ]# K5 I5 G x. G* X$ O4 w* N5 ` REL参数说明两个文档之间的关系,HREF说明目标文档名。关于层叠样式表,将在后面的课程中详述。3 `/ V2 |' l$ P8 ~ ^9 _; O
BASE
( y: _+ n; X! r | 本文档的原始地址。语法是:
, R) F- p) S8 c6 H* i 1 Z( R6 \8 F/ t O4 `1 w0 ?
这样,读者下载你的文档之后,也可以知道是从哪里下载的。1 h+ g$ k* V' B
BODY1 s" Y5 u \- Y# G: \+ n& T' G, L
BODY标记有一些属性,用于定义页面内的显示效果。! ?5 c+ F H: X% i8 Z, }
ALINK、LINK、TEXT、VLINK—— 文字的颜色。
: e$ Q: R( i+ s+ p. X ALINK:当前激活的连接的文字颜色。+ K$ H/ I) h( r5 G+ C
LINK:连接的文字颜色。
4 N3 c3 o7 ?% l2 X' Z& B TEXT:文字的颜色。& L( @2 f- v& w- l- i
VLINK:参观过的文字颜色。
0 A, ?& w; r" B, R$ t9 D D4 C 注意:文字的颜色要和背景色有明显的差别,以便读者浏览。
# J+ I" f7 G8 o% T9 U BACKGROUND、BGPROPERTIES、BGCOLOR——页面的背景部分。
' y/ Y5 V- w- O3 s3 e5 T- t BACKGROUND:背景图案,该图案在页面内平铺。背景图案应保持单一色调,以保证页面文字易于阅读。
0 T' [3 f3 A/ x; ]8 V BGPROPERTIES:设置成FIXED,则背景图案不滚动。(只对INTERNET EXPLORER有效)
/ X# x) x, L% c' C! B BGCOLOR:背景色。
* j6 c n8 _. r; n. H 注意:如果你的背景图案是深色调,因之文字颜色为淡颜色,那么由于浏览器调用页面的顺序是“背景色-文字-背景图案”,那么在背景图案没有显示的情况下,你的文字在白颜色下很难阅读,所以应该选用一个跟你的背景图案颜色一致的背景色。1 {9 z- |$ r, m9 q l3 Q
LEFTMARGIN、TOPMARGIN——页边空白。(只对INTERNET EXPLORER有效); R$ o7 G7 |9 l2 A C* T5 h* t* O# H
LEFTMARGIN:左边页边空白。) n* d" ^* L: }( i0 o
TOPMARGIN:顶端页边空白。
+ ? D$ H! a4 u- p HTML的基本元素就是这些,怎么样,不太难吧。下一课我们就开始制作完整的HTML文件。好了,下课!如果你有什么地方不明白,就来我“办公室”问吧。 |
|