获得本站免费赞助空间请点这里
返回列表 发帖

HTML的基本元素

程序编制; k, {9 a; u. y0 v& y
    随着WEB的发展,与浏览者的交互越来越受到网站制作者的重视。现在的主页跟最初的静态主页相比,界面更加友好,功能更加丰富。这些技术需要一些编程语言来完成,如javascript、VBSCRIPT、CGI、ASP等等。要想使自己的网站在因特网的浩瀚海洋里脱颖而出,就必须掌握这些编程语言。
% `  ~( q6 d9 z6 O/ Y    经验" }$ i% D: u* r) T( S& {* `
    经验不是一门技术,却是你制胜的法宝。网站制作中的很多问题,如网站结构、版面安排、中文处理等,都需要你的经验。网上有很多设计优秀的网站,要多学习、借鉴,自己多动手、多尝试,相信你也可以做出引人注目的漂亮网站。
6 L7 c; E& r4 n, V    页面基本元素, b7 [2 X( {& w8 m6 ^( Q* B" K5 Z
   HTML的样子. P+ a4 e$ M4 Z9 r
    HTML语言是由一系列标记组成的,每个标记有它特定的含义。标记用<>标示,以便和页面的内容区分开来。大多数标记成对出现,后面的标记加上一个“/”,表示结束。就像这样:* Q# x- y/ |, h" \* t0 S
    这是黑体。+ w+ e4 {* V% U/ ]. w
    这句话的显示结果是:$ h( i! c. W, N" L
    这是黑体。& p" F3 z* g7 z
    表示黑体开始,表示黑体结束,标记在浏览器里不显示。如果你用过WPS中文处理系统,就会发现HTML的标记和WPS的控制符有点类似。把HTML的各种标记弄清楚,你就是主页制作大师了。简单吗?不一定,我们还是开始学习吧。
9 _2 D- Y) [9 e  [9 U1 `; d    我的第一页
' Y( l% E) [! F. }' k  Q6 s9 R我们首先来看一个最基本的主页的HTML代码:4 |* i2 y- D! X
# u- R& |8 W0 ^- j4 d
--------------------------------------------------------------------------------
1 `/ K; M8 c! K1 s/ \2 K* tfirst.html
3 n& d; e5 w9 p- c, w这里是页的内容。) k& U2 b, l3 c
% K# k% @8 W% N+ P# U# A, n$ B
--------------------------------------------------------------------------------9 L3 M: j/ m5 P- C
    在“记事本”里输入上面的内容,保存文件,注意把“保存类型”改成所有文件(*.*),输入文件名“first.html”。使用浏览器查看一下结果。& |# x) h2 t1 c' i0 D
图1-11 g) l6 o8 |1 \( h4 j) `
    从浏览器的“查看”-“源代码”菜单项里,我们可以看到我们刚才输入的源代码。
6 Z+ v. Q7 M0 G' h9 s) G    对比源代码和显示结果,我们发现,一个基本的HTML页有以下几部分构成:/ z( G2 i# z7 f, z
# V' X6 Q; U, h3 H5 C+ q* V5 K
    说明本页面使用HTML语言编写,使浏览器软件能够准确无误地解释、显示。4 \5 D( X6 I( B/ T6 j

/ d5 a; D+ w  h' c' d! @# m9 Z; N    HTML页头,包含页面的一些设置信息。2 B# _/ \, t/ k; b/ @5 k6 D' h, ]
! v9 f/ @1 S5 `4 t* T; H1 u
    TITLE是HEAD中的重要组成部分,它包含的内容显示在浏览器的窗口标题栏中。如果没有TITLE,浏览器标题栏显示本页的文件名。网上有很多人忽略了TITLE的设置,你可以经常看到UNTITLED或HOME PAGE等这样的默认标题。由于Internet Explorer的收藏夹和Netscape Navigator的书签都是用TITLE作为存储地址文件的标示,所以为你的主页起一个恰当的TITLE是很有必要的。
3 @) @% Q. I  R% J0 Z. r6 Z( Z
; z+ }3 ^& a2 M4 B- f. w- B/ W    BODY包含HTML页面的实际内容,显示在浏览器窗口的客户区中。
* U. |; R. f" d/ V' y1 R    页头
9 k0 E9 F3 a) }6 O    除了TITLE标记外,HEAD里还有其他的几个标记。这些标记虽然不常用,但是需要有一定的了解。
2 [0 w7 C4 A$ x, f- h. Z. l! g) ~META* @: N9 q, M: X% H9 `+ f' S0 ?
    META标记用于描述不包含在标准HTML里的一些文档信息。激烈的竞争使浏览器厂商纷纷利用META开发出许多实用的功能,又使这些功能在常用的浏览器中都有效。下面介绍几个很有用的用法:4 X5 C& J5 @  q; \. X

/ M5 x/ ]! Z7 H  |" U+ m+ f+ i+ I- d( W5 C2 p& I* T
    本页的关键字和描述。在页面里加上这些定义后,一些搜索引擎就能够让读者根据这些关键字查找到你的主页,了解你的主页内容。
& p: t' {) y; M7 T- ?3 T% s4 @5 j& a& X# c- }; c
    浏览器将在60秒后,自动转到new.htm。你可以利用这个功能,制作一个封面,在若干时间后,自动带读者来到你的目录页。. Y1 j' x, A, m& V& g
    如果URL项没有,浏览器就是刷新本页。这就实现了WWW聊天室定期刷新的特性。$ C0 f2 U  d/ K( A& l5 p

8 J! r/ |  v/ X+ S- }) s    描述本页使用的语言。浏览器根据此项,就可以选择正确的语言编码,而不需要读者自己在浏览器里选择。GB2312是指简体中文,而台湾BIG5内码的主页则是用BIG5。
1 u& t# z' m0 Y+ b& k) l
, g  U7 Y" l  s+ _' U8 B    强制性调用网上的最新版本。浏览器为了节约时间,在本地硬盘上保存一个网上文件的临时版本。在你要重新调用时,直接显示硬盘上的文件,而不是网上的。如果你想让读者每次都看到最新的版本,就加上这句话。
. j. j+ c7 |1 x2 ~  J  }8 _LINK
7 P! P+ Z" O6 f0 A+ |3 S* s) x    显示本文档和其他文档之间的连接关系。一个最有用的应用就是外部层叠样式表的定位。格式如下:
. G3 j+ ^- o8 g# n5 t    4 j' J7 v7 R' c, Q) q- t0 }
    REL参数说明两个文档之间的关系,HREF说明目标文档名。关于层叠样式表,将在后面的课程中详述。
7 v. C' |, ~) z: C) M! RBASE
  H8 T& N" V+ l  t* s% g# O- x9 }1 k    本文档的原始地址。语法是:
2 u# L5 ]6 l7 g& \0 x$ ]9 b   
) |3 q& V+ O9 d1 z1 B8 z    这样,读者下载你的文档之后,也可以知道是从哪里下载的。! s4 i/ E' W7 f
BODY
- j. E4 D- z9 z% s6 Y    BODY标记有一些属性,用于定义页面内的显示效果。/ ?/ u& X0 ?# ^' i6 r; z9 p
    ALINK、LINK、TEXT、VLINK—— 文字的颜色。7 a: P, q% j: w% G, |( G  {
    ALINK:当前激活的连接的文字颜色。9 x1 s# Y" n/ a3 J% Z: M
    LINK:连接的文字颜色。
# v% Q3 T, E7 C- C7 d    TEXT:文字的颜色。
. [5 W0 `) M" t: K: \2 a: b6 {  G8 {    VLINK:参观过的文字颜色。7 w0 a  d  @& I: Q+ L1 b6 J( T1 S0 `# _
    注意:文字的颜色要和背景色有明显的差别,以便读者浏览。
! Q. f. T* K! L/ R    BACKGROUND、BGPROPERTIES、BGCOLOR——页面的背景部分。
# m# p5 }( W/ [( }. p6 h    BACKGROUND:背景图案,该图案在页面内平铺。背景图案应保持单一色调,以保证页面文字易于阅读。# {4 B  D/ c+ l# f# Z$ X
    BGPROPERTIES:设置成FIXED,则背景图案不滚动。(只对INTERNET EXPLORER有效)  i. S6 f4 i$ U$ G  P
    BGCOLOR:背景色。: {& |. R2 p- y: e2 L4 w5 r% j
    注意:如果你的背景图案是深色调,因之文字颜色为淡颜色,那么由于浏览器调用页面的顺序是“背景色-文字-背景图案”,那么在背景图案没有显示的情况下,你的文字在白颜色下很难阅读,所以应该选用一个跟你的背景图案颜色一致的背景色。
  S6 q# W  p' R) L* V; n5 l    LEFTMARGIN、TOPMARGIN——页边空白。(只对INTERNET EXPLORER有效)
7 h; Z+ ^5 E7 U# W) }+ P! B) G! p    LEFTMARGIN:左边页边空白。
; K$ c# ~- l* M/ ^    TOPMARGIN:顶端页边空白。% E/ {; p" A' g/ S
    HTML的基本元素就是这些,怎么样,不太难吧。下一课我们就开始制作完整的HTML文件。好了,下课!如果你有什么地方不明白,就来我“办公室”问吧。

返回列表
【捌玖网络】已经运行: