飞翔无限fxwx.com广西经贸职业技术学院论坛
标题:
[建站技术]学习html代码最基础
[打印本页]
作者:
月中水
时间:
2009-10-16 01:16
标题:
[建站技术]学习html代码最基础
html基础
% k/ a+ p y+ i5 w+ h4 q
$ q3 s; b7 J) T. A+ {
当我们畅游Internet时，我们透过浏览器所看到的网站，是由HTML (HyperText Markup Language) 语言所构成。HTML ( 超文件标记语言 ) 是一种建立网页文件的语言，透过标记式的指令 (Tag)，将影像、声音、图片、文字等连结显示出来。
6 j& {# { h5 m) T
HTML标记是由 < 和 > 所括住的指令，主要分为 : 单标记指令、双标记指令 ( 由 < 起始标记 >，< / 结束标记 >所构成 ) 。HTML网页文件可由任何文本编辑器或网页专用编辑器编辑，完成后 ( 以 .htm 或 .html 为文件后缀保存 ) 将HTML网页文件由浏览器打开显示，若测试没有问题则可以放到服务器 (Server) 上，对外发布信息。
x* ~! s) W$ q! p& p: i
, g7 k$ z$ o. n/ v. v
HTML文件基本架构
- H4 N7 b$ A- V. g4 }( f3 N& g
: X: f9 W- ]0 T
<HTML> 文件开始
* i+ j5 x2 ^4 B9 ~! h- w; V
<HEAD> 标头区开始
( ?4 g! d2 a* N/ @& u2 M* d* ?2 F
<TITLE>...</TITLE> 标题区
2 T7 b" _8 D. n' U- K/ v5 ^
</HEAD> 标头区结束
. L6 J5 t( |9 j: x8 R" _
1 }8 o4 d) D0 N* O
<BODY> 本文区开始
9 W& E1 j, n* t6 J, x) k/ e/ e
本文区内容
5 d4 \- g; h' y1 Y( I3 j3 W' @: r
</BODY> 本文区结束
2 V6 x: Z# v. |) ]$ d
# m" C9 y# _9 ^+ z5 [0 H7 Z, P
</HTML> 文件结束
: X1 h* d" U/ k$ [
% {+ w( B$ v) A$ _
( i* V, `+ s# W( H$ D
<HTML> 网页文件格式。
' q; ~" r# `/ F6 m3 Y
<HEAD> 标头区 : 记录文件基本资料，如作者、编写时间。
# g4 Y$ v9 g$ n$ D2 _
<TITLE> 标题区 : 文件标题须使用在标头区内，可以在浏览器最上面看到标题。
# ?. R# F& k- c# T, W3 ~; k; z) I
<BODY> 本文区 : 文件资料，即在浏览器上看到的网站内容。
* L5 w7 X$ G( ]
0 r1 R% |& Q4 H) B; q
注意事项
* l5 c& {1 ^7 a, s3 y
~! B; Q7 S @- Q* F* ~
通常一份HTML网页文件包含二个部份 : <HEAD>...</HEAD> 标头区、 <BODY>...</BODY> 本文区。而 <HTML> 和 </HTML> 代表网页文件格式。
# q5 h8 n- v4 B" b
" [" x2 p/ g O6 l O/ f
习惯上一个网站的首页名称通常订为 index.htm 或 index.html 这样只要浏览网站，浏览器便会自动的找出 index.htm 文件。
3 V$ D3 c# X1 e* I I' F
8 |4 b9 v- l6 o6 c$ N0 H# @: O
字体
8 x5 M: y8 n: B- h7 H+ ^
+ g) ^ O2 m6 y$ I8 E+ N& q
我们在这里将要谈的是有关文字的标记，包括字体大小、颜色、字型...等变化，适当的应用可以增加页面的美观！
0 o: s' c# M1 j/ Q x' Z1 G4 ]
( K" {) Y k. f$ p" h: B% [
常用字体标记
6 C* a9 N" W5 l, }) W2 i
) K/ w4 w: J5 H1 b% n
<Hn>...</Hn> 标题，设定标题字体大小， n = 1 ( 大 ) ~ 6 ( 小 ) 会自动跳下一行。通常用在如章节、段落等标题上。
0 ]9 J" O. H" c- @' c2 m3 f
如 : <H2> 标题 </H2>
& X8 c, L* `: {8 b! b n3 `% Z" l
; A. T+ c& ^; Z
标题
& k' L, {; [; n' A1 K p
如 : <H3 ALIGN = CENTER> 标题 </H3> ( 标题置中 )
! t2 B+ M, m3 Z- X; Z: ~+ O) d# i0 L
标题
5 a# u8 m r5 L" [! g
<B>...</B> 粗体字。
2 I/ V3 `8 U6 g, J
如 : <B> 粗体字 </B>
3 m$ F( O6 A1 ^% m! F1 D, F' h( _
# W! M# A& ~0 Z- f/ ~; l0 J
粗体字
! q6 T/ b, r8 a
* \3 q' |1 Z \, w/ ]
5 s- O8 r q& x% M+ U4 [6 O
<I>...</I> 斜体字。
5 B9 x" f% r1 _$ c$ l8 k% y
如 : <I> 斜体字 </I>
9 G+ w1 N: T' f* A; J
斜体字
, v% W8 X5 W/ W; D" \
! ]1 F5 G1 _; A6 ?4 a
0 T$ V8 j( n. h, O6 Y
<U>...</U> 加底线。
+ X4 S% b0 {, K3 A
如 : <U> 加底线 </U>
1 C% n4 o0 R. i
加底线
6 a6 K& R& W* s! Y1 B
- s6 s Y- e; c7 U6 o) b
H+ Y( {% \% g% P+ x
<DEL>...</DEL> 横线 ( 表示删除 )。
6 K% L1 t2 F8 Y, K' d0 m
如 : <DEL> 横线 </DEL>
6 U- D; P, e' t: g
横线
( E$ J! S( H7 N$ p
: X2 w1 T* v4 o/ P4 H& }8 K
# }. J* O1 s3 w4 Y
<TT>...</TT> 打字体 ( 固定宽度文字 )。
! J+ p- D& n1 [. ]2 @6 O/ X9 b x% |
如 : <TT> 打字体 </TT>
% H B _0 N% p6 t+ n5 C+ j- y
打字体
; o# g& T$ K$ ]: Z+ d4 T
/ F1 M% ], h6 ?. g( N, c
0 s* Z9 {! F. w5 e3 a# C
<SUP>...</SUP> 上标字。
# c1 K B! `. v0 q r4 R, i: K5 D
如 : 字体 <SUP> 上标字 </SUP>
1 x, g1 I# @$ [) p3 v! V5 e( Y
字体上标字
3 M& Z: D3 S3 L
: e y5 p+ G* F+ n# M m5 ?2 w& G$ q
$ k4 b2 o$ E0 [( f& j' l8 O8 N+ x
<SUB>...</SUB> 下标字。
* o/ {1 T: ?/ G# d+ |7 M" z
如 : 字体 <SUB> 下标字 </SUB>
* \" L' e0 S. H( j0 h
字体下标字
0 i5 e8 \; \2 N: C& p
5 B. f1 l3 {! M1 e) B
' `9 V, J8 J! M
<!...> 注解 ( 不会显示在浏览器上 )，可以多行。
1 ^1 v# p1 ], |6 t' ]
4 Y) B( k- v$ `7 D& r( M
如 : <! 更新日期 : 2000/1/1>
: Q9 Y" _ F3 i% H) Z+ ]% E
' K5 q/ k& `% W2 P: _: m" u
! Q- \, q8 d7 D+ Z& ~- t1 e$ o4 i
5 Z$ Y- _8 T1 d. ^7 e; C2 F
设定字体大小、颜色、字型
9 I( N" v& m) I+ ^& s7 ~
# T. L. [ U; ?- H' V: ~, G
有关设定文字的方法共有以下几种 :
+ M: ]8 q% W# ` x4 ]) r
1 v$ e3 L; W9 c/ [
1.设定HTML文件主体文字颜色。<BODY>...</BODY>标记。
5 V% O5 W! N' Z ~
& f; I$ q5 \! I. M" D* ]% H3 F. D0 R
( k. r( \/ n( P) A! l! |1 S
如 : <BODY TEXT=RED>...</BODY> 或
9 s9 O% H+ }: v2 t
<BODY TEXT=#FF0000>...</BODY>
" M- w0 |3 _" i/ }: E: o# n* K/ C; |
- V- J) A4 A( R7 s& `
2.设定基本字体大小、颜色、字型。<BASEFONT>...</BASEFONT>标记。
' u" w# p9 m5 L% d/ U3 l8 L
M0 u6 ?: o8 L8 V
3.设定字体大小、颜色、字型。<FONT>...</FONT>标记。
* N8 X) V. {6 \2 P7 V* k. S6 h7 s
3 R* }# V6 m6 C% K' c8 ]* p4 @
<BASEFONT>...</BASEFONT> 设定基本字体，SIZE = 1 ~ 7，1 ( 最小 ) 7 ( 最大 )。
) j& R! r4 s/ X% q8 z. c* `& f
如 : <BASEFONT SIZE=4> 基本字体大小为 4 </BASEFONT>
& d, |! N0 v6 y# O3 f
基本字体大小为 4
; N1 D, | C6 z
! G$ \ I6 ~% ~' P* ] p, r9 G
如 : <BASEFONT COLOR =#FF0000> 设定颜色 </BASEFONT>
+ b p" d1 D1 d% X1 l. X {2 f4 |
设定颜色
" Q5 p" F) M, ~5 Q. B5 E
/ u a, t/ X/ h2 f/ i' c; {( j+ C
如 : <BASEFONT FACE = 标楷体 , 细明体 > 设定字型 </BASEFONT>
n7 z4 w8 j, W" U5 P" h7 |4 v
设定字型
- b1 {4 @8 I6 d; K
' E4 T- G$ ~2 `! N! U" M' k+ h
" ]1 H% E/ N% e. K* s" `+ A
<BIG>...</BIG> 基本字体加大。
! o0 A6 L8 x1 Y1 t# p: f& ^- b
如 : <BASEFONT SIZE=4> 基本字体大小为 4，</BASEFONT>
7 q* V* t0 C+ T
<BIG> 加大为 5 </BIG>
3 W+ b8 ^& C$ t. f5 r
基本字体大小为 4，加大为 5
4 ^: N6 g, T& m- t( V/ k
5 D4 {3 F1 i, F. q4 g1 B
/ w" C7 q Q3 M
<SMALL>...</SMALL> 基本字体减小。
+ S6 N( k2 i4 B9 j+ e5 J% V
如 : <BASEFONT SIZE=4> 基本字体大小为 4，</BASEFONT>
M6 `& p6 ]6 c# e6 Z$ M, b
<SMALL> 减小为 3 </SMALL>
8 n! S5 M0 e, {8 q
基本字体大小为 4，减小为 3
& V/ C1 o4 p( O# l
3 p# B* n, E+ ]. D1 Y
3 W. e7 Y$ s4 d# i
<FONT>...</FONT> 设定字体大小、颜色、字型，SIZE = 1 ~ 7，1 ( 最小 ) 7 ( 最大 )。
$ r8 |; F$ a4 y) }
如 : <FONT SIZE=4> 字体大小为 4 </FONT>
: m; Q% n% `+ d0 p
字体大小为 4
2 P% n, R, {6 _
$ s: `: p: C2 F3 y% _8 G/ s
如 : <BASEFONT SIZE=4> 基本字体大小为 4
0 i1 L, c E1 V: g# O6 s+ r1 @
<FONT SIZE=+1> +1字体大小为 5 </FONT>
8 u3 f. C+ a5 s8 W" U; [& H9 D
<FONT SIZE=-2> -2字体大小为 2 </FONT>...</BASEFONT>
3 z0 ]+ a, @: ^, _% G |1 c+ q
基本字体大小为 4
' t( v5 `5 O5 |
+1字体大小为 5
. r% y( \4 u" L, e/ g
-2字体大小为 2
% E: B ^; w5 h z& J4 e0 y- D2 d
! g; q( c0 z$ D
$ b( |: W* _% R& |
如 : <FONT COLOR =#FF0000> 设定颜色 </FONT>
/ v8 y. {( ]& j) |) n: S& K2 @
设定颜色
2 I0 q0 b: t) i$ @, ]. g
3 S, q. a. y6 Y
如 : <FONT FACE = 标楷体 , 细明体 > 设定字型 </FONT>
: e) u/ e" z/ n
设定字型
M% U6 O$ t9 |) |6 z0 }
1 J; T* ?- ~$ z# N# W) X% `
: C# `3 R1 B. A2 B$ k8 N
4 Z4 O; ^% s$ H. n l
注意事项
) S2 \* t' y( m; A: O
6 S/ X3 Z% s9 w/ O% P' ]: b
1. 设定字体的大小分 : 绝对SIZE 如 : <FONT SIZE=4>
9 T1 O0 r& ~6 V7 ]) Z
和 相对SIZE 如 : <FONT SIZE=+1> ( 以 BASEFONT 设定的字体大小做加减 )。
* m+ d& B. z5 H; W7 L( b2 y% B p
; [6 F4 {# e( a
2. 设定字体的颜色可以是颜色名称或#RRGGBB表红绿蓝强度 ( 00 暗 ~ FF 亮 )。 #RRGGBB 所代表的是红、绿、蓝三原色，每一色由两位十六进制的数值表示 ( 即十进制 0 ~ 255 )。
, C A, X: @3 ]8 a4 i: Y
十六进制 : 0、1、2、3、4、5、6、7、8、9、A、B、C、D、E、F。
9 m3 I+ Q3 G- B; @; R) b
B) x) D. K: z" b. {9 b
3. 设定字体的字型会按照顺序找出显示的字型，若找不到则以系统预设字型显示。
/ G4 ]5 Q0 o0 w4 f0 _$ r' ]7 b5 }
. R+ f/ _) z$ Q
表格
: q3 E& J" {( `. J
5 B& v* m) A; V, {. Q% J
表格是HTML的一项非常重要功能，利用其多种属性能够设计出多样化的表格。使用表格可以使你的页面有很多意想不到的效果，使页面更加整齐美观。
2 H* z7 l# [4 D& q% C6 Y
( M6 `, K# n4 K) j6 V
常用表格标记
H' F2 H6 j' B4 I8 D3 P# b. I
3 P Q1 m" {+ p! m4 Z6 F! u9 \
<TABLE>…</TABLE> 表格指令。
' M" J0 p) @# F9 T& {+ ~8 Z, T
相关属性 :
( K1 H- C7 z4 e1 P# N' F
·ALIGN 调整
) a! H" j0 q3 R* M' \/ b
·BGCOLOR 背景颜色
; ~$ R+ n! V6 H+ n, L
·BORDER 边框
5 u. z" U2 g! l/ X- J9 s
·HEIGHT 高度
g4 j1 c% _/ k
·WIDTH 宽度
! [. A3 o; h6 J' T( j7 q1 n
! U) Z. |6 K5 m$ g2 {6 |1 U
4 p8 [/ Y, `4 }, {! p+ k
<CAPTION>…</CAPTION> 表格标题。
& o1 C* G; L% l- z
相关属性 :
% A' V& p U2 u) Q F' i0 x
·ALIGN 调整
4 ^9 {& I3 d; P" u% i
) l- `4 |2 H- [3 l
( \- y) A# u* D4 R# k
<TR>…</TR> 表格列 ( </TR>可省略 ) 。
: l/ {/ U, r; V" I" s" Y2 t
相关属性 :
7 J& g2 P# x2 d* T7 v
·ALIGN 调整
0 h" U+ @6 T* u2 H- j' i' k" u( e+ X' b
# v3 U* w2 j3 e& f3 f- p l
# ^+ u- h% Z: ?2 \& X0 m
<TH>…</TH> 表格栏标题 ( 表头 ) 粗体字 ( </TH>可省略 ) 。
7 g" t4 K. h" ~' ^# Z% A& N
相关属性 :
- x: n$ O2 j6 J- Z- f0 i- N+ x
·ALIGN 调整
" D- i' E4 N9 U# u
·COLSPAN 栏宽
5 Y2 g) t0 j% x- S! ^( ]
·ROWSPAN 栏高
! N5 [1 S6 X9 y( j' i3 l \, \
5 n9 t; I" F' H: l/ |2 N6 X8 g" v" q
! g0 K% u6 `6 m" i; E. t3 G1 R
<TD>…</TD> 表格栏资料 ( 储存格 ) ( </TD>可省略 ) 。
. d v4 t7 b* l* i( d$ j8 F' N
相关属性 :
4 q u" h" j% r) S$ A; ]
·ALIGN 调整
. i5 c1 T; ?2 X& o7 p
·BGCOLOR 背景颜色
" z# _) K, {2 h: Y5 y% s( y
·HEIGHT 高度
' M% {9 U: x; N) E
·WIDTH 宽度
" I; D; l% n+ M' x( A0 A
·COLSPAN 栏宽
- B5 V, ]1 F f+ L, d
·ROWSPAN 栏高
% C" z. V. h' l+ k( Z* z d
1 L- C# D, M: q% }1 @$ j
! y5 j) C0 a( O! L8 j1 S7 q
举例
9 m7 n# k: {! D; \4 K0 x- L
# O( r5 l7 Z/ m7 z z
如 : ( 基础型 )
9 e# A4 ~+ t- e3 p2 i
<TABLE BORDER=1 ALIGN=CENTER>
' A& o- c* A; [/ `' i
<TR><TD>华夏黑客联盟<TD>华夏黑客联盟
: D) i) f) V' T6 q4 M
<TR><TD>华夏黑客联盟<TD>华夏黑客联盟
; {3 N8 F w, P) {4 ]% T0 ^
</TABLE>
7 o0 B0 B! ?% b! U- e9 X
华夏黑客联盟 华夏黑客联盟
0 K. k. F, f3 |5 {! M1 i0 u# O
华夏黑客联盟 华夏黑客联盟
" I! k7 d. G# }0 J
: H. N0 U) {, d8 x0 y, s* k
( n [3 }2 k" i2 ]3 i& O7 \6 z" r4 o
如 : ( 加强型 ) 增加背景颜色、表格标题、栏标题、跨栏宽、跨栏高。
9 O( N8 I, L3 M" `- C9 d& s. U
<TABLE BORDER=1 ALIGN=CENTER BGCOLOR=#CCCCFF>
/ X+ |4 Z$ G" K. E
<CAPTION>表格标题</CAPTION>
: }, g% u. C4 r4 P1 v5 T* ~
<TR><TD><TH COLSPAN=2>行标题 1 <TH COLSPAN=2>行标题 2
1 H6 ^' ]: s' A: s& i
<TR><TH ROWSPAN=2>列标题 1 <TD>A <TD>A <TD>A <TD>A
1 k$ W3 a# ]2 T
<TR><TD>B <TD>B <TD>B <TD>B
: ?# A( w' b w: ?! u/ E, z
<TR><TH ROWSPAN=2>列标题 2 <TD>C <TD>C <TD>C <TD>C
+ l3 F; R, y+ W8 i3 O
<TR><TD>D <TD>D <TD>D <TD>D
A" g& B" ]$ Z5 a
</TABLE>
1 O; v7 F, |3 [) U6 W
+ F, |: N, U. w8 N
标示
4 o$ M8 l% }- \
4 B; s4 q& L4 ?' O% n
HTML提供许多种类的标示标记，作项目标示，而且可以作巢状式标示！
1 y" h. T; A% W0 \3 J% _2 y, U
. ~; N ]- D# _8 d. H: }# @+ }8 K
常用标示标记
. J% r' |( O. U S$ Y
3 p+ J: R5 K# w. q. n! O; z
<LI> 标示项目。
6 j! y- g2 H/ P- @& L/ H, ~
如 :
: e3 N. Z4 a# e. K
<OL>
! H! R, X, X$ s( Q* f& s
<LI>第一项
' T8 X; `! {7 q; |" ?; P
<LI>第二项
" r# G- c8 ^6 n! q- |
</OL>
6 s& A, `5 z* ?9 F r
! r6 [) a1 N' U7 M# o6 k4 H
4 |/ g2 o. z/ @; ~' U
第一项
& \0 \: z. c6 q1 b
第二项
) x' |2 _$ c1 K; F% s/ ^$ q6 ]
( u5 U8 Q9 D0 E4 g& ?. ]1 a }
<OL>...</OL> 编号标示，可标示数字或英文、罗马字母。
& i: g; [- |: v+ c
如 :
$ C. w2 a- E. g$ Y: i
<OL TYPE=I>
& F, N2 `$ A; k
<LI>第一项
. P4 T, B9 v& d3 r" ]/ {
<LI>第二项
* N" k) L. ^9 z) @ ]
</OL>
9 z% q) L7 k' c- ~! _7 ]( g! K6 Q
) M" s2 a5 N4 ^; z
4 G% o1 Y3 K P
第一项
0 j! l/ r/ o: L) D1 W; h
第二项
7 G8 ^' G7 E2 G& Q+ Q' s$ `
2 L, P/ F, k9 q" W9 T) ]
<UL>...</UL> 符号标示，可标示数字或英文、罗马字母。
# g$ n2 G% B- n. L) g3 T5 v
如 :
C' D1 N1 a( o6 Y Q' D
<UL>
$ }* \/ G7 l8 M+ L* g
<LI>第一项
7 ]8 t0 t1 ~0 G* \/ |
<LI>第二项
$ l. }5 _7 C7 t Y
</UL>
) F4 _% T" B) F/ j i; @
2 p2 Z v" I3 Z, N, j
- n6 w5 J+ e# {7 R4 b6 \
第一项
- x0 k+ M! m; H& E; b! q1 |
第二项
. y' W" B7 Q' F$ ^1 l
' f. u/ |. N) f# }
<DT> 定义项目。
, r0 ]( V/ S, A5 f: g; C8 M/ a
8 [$ ^% e# R* N' c0 a
<DD> 定义资料。
: G2 y Y; o& N
7 L: C4 |2 \4 Q1 k- M2 S: c
<DL>...</DL> 定义标示。
. F0 k% c* [2 u0 T9 Q
如 :
" p. ~4 M5 c. u2 S* N& K
<DL>
4 O8 \# k' H& ?6 ?6 P, Z2 L h1 ]
<DT>十进制 :<DD>0、1、2、3、4、5、6、7、8、9
6 C6 J) v/ p$ u; ?) z9 r- O
<DT>十六进制 :<DD>0、1、2、3、4、5、6、7、8、9、A、B、C、D、E、F
) N- j2 m8 l/ E2 z+ T9 V: L
</DL>
/ s7 Q! m9 t9 o: {4 X- e
7 Z0 X1 q7 f. \7 y8 }; D- N# w4 c
+ f! q" e$ Z- i5 ^+ w
十进制 :
8 q( E: r8 Z. @5 F5 j/ ?
0、1、2、3、4、5、6、7、8、9
) b- k" K" P9 K8 ^0 F: O; R; e
十六进制 :
9 C( z& l% S$ v, y4 z
0、1、2、3、4、5、6、7、8、9、A、B、C、D、E、F
) ]9 A7 W( d' t3 Q0 y
1 M- Z! t% k& v7 v4 S
巢状式标示
( L0 h4 Y$ ]' r7 J
5 i# B) z" _: T2 t
如 :
& L2 @- ^2 t: a/ s( t4 Y) p
- G8 ^1 X- Y6 h; l# z2 r: j' B
<OL>
8 M9 { l3 \' C9 w5 k. N% O
<LI>第一章
: b# q0 S5 {. U' b3 B' G4 B0 m) t+ W
<OL TYPE=i>
& {( Q" f n) T5 z: J: @& ^
<LI>第一节
& V3 ]5 E# ~" R: x7 b R- l
<UL>
7 _9 y* Z C" E9 ]& \) N
<LI>第一段
$ a' [- Y8 g$ D
<LI>第二段
1 Q. r6 g) U. p3 u% V8 V+ ?
</UL>
3 X8 m+ x; {9 Y! k$ n# d# ?
<LI>第二节
7 U4 t- ^% q' }! W
</OL>
& U# R4 V- e+ ?% @
<LI>第二章
% }% _, E5 `) T3 o1 L
<LI>第三章
% i7 r9 ?, N) P# x# g8 N
</OL>
g. V$ \/ ]: ?# L5 ~# ?
第一章
: {# i7 z3 |6 Z; k
第一节
$ A/ k' k& c5 r5 o
第一段
! E0 ]$ ~6 s' D6 p
第二段
/ {) E6 s: ^5 l4 {' j
第二节
& L! Q! j" c0 n4 v9 \: q: x) f y2 l
第二章
$ p- ?$ b: ` C
第三章
5 d1 }. r \# _+ F/ o
其他标示标记
& }( p4 X* J! f- ?2 t' _% {5 r! Z) G
D; W6 O! m; ~1 y
<DIR>...</DIR> 目录式标示 ( 自动加圆点 )。
) F R0 d$ v& m; q. P5 y
如 :
7 `! f! @3 p1 a3 Y% Z) ?
网络学院 :
* D w- g, o( Y4 s. A: Z
<DIR>
; L \0 i9 h' V" W# K9 {% x; t
<LI>新手上路
9 R7 t" b& x! f P" E9 V
<LI>软件教室
7 i$ X# d, ?( X/ H; e$ Q+ }' @
<LI>设计教室
/ L+ m7 X/ y( k I0 J; C
<LI>开发教室
0 R& F7 K3 b: ~# O# z7 ~! A
</DIR>
7 V8 R; z8 ^4 r* d' N! D/ s
5 j1 z: m% j# b' A
网络学院 :
- M% R; I/ e$ E4 v) [! P
( k8 ]! O3 e K, `7 ~
. | {2 i7 i. Q, O
新手上路
5 P# M8 U( @ g5 N
软件教室
1 E, ^8 j6 C# [3 C9 m. }" d
设计教室
7 t( {. @, h6 n& T( ?9 X$ \
开发教室
+ a. ~5 o4 f( `" \
8 J- r8 Q* \: q2 R2 B; l
注意事项
9 h. m4 `( ~! B* j
3 ^) G/ t, u& M# h
标示项目符号也可以用<FONT>...</FONT> 标记，以符号字元 ( ○、◆、◎、★、■...等 ) 标示。
1 I6 N' j/ ~' E8 w$ j. \8 [# ]
) o; Y: y- M+ ]- H
如 :<FONT COLOR =#FF0000> ● </FONT>
) \+ m: |' t* R4 s) l, L. [
3 d8 J7 e0 Y9 D) X
特殊符号 :
: Z* e6 P( A$ [* B
/ L) k \" [ T/ U% B
在HTML文件中，有些符号是代表特定的意义的。所以当我们要使用这些特殊符号时，便要用替代指令。
2 K l& T, R7 J* |. e) R8 }4 ?
1 u( n/ ]7 R2 a. n$ i
- S. q' a6 Q6 J
符号 替代指令
6 @) I0 [1 a5 N7 D' ^$ t
" " 或 "
T* k! q( ~7 @6 D7 [; X+ J
& & 或 &
5 ?: s% V. R3 D' Z% r# n+ ]7 r
< < 或 <
+ v- b( O* {$ \0 @ [3 P% y) K
> > 或 >
6 @& B% R' f& Y% Z: T ^: y
不可分空格
7 e3 L+ d- Z! }+ H& `
, V5 M a: k. k
区段标记
: } u* e" |) z
7 o, H, K% a6 R4 G, h2 g
一个网站不仅要内容丰富外，也要有美观简洁的版面。HTML所提供的区段标记功能，如果可以好好的利用也会有相当不错的效果。
. _5 z3 e4 W4 @2 j* l
* a: {2 t5 b0 `8 X2 z% L% m& A& M
常用区段标记
& a5 u3 I& e/ e8 p3 J8 [$ p
2 l9 P. o) x, _2 [1 @" k
<HR> 产生水平线。
8 j Z, G5 i; Z- W/ ]/ k! z. Q
如 : <HR ALING=CERTEN WIDTH=90%>
( `) v l4 P) |$ l1 v/ E
) S2 e: H# s2 R. G! H
0 Q. g5 {+ c8 w8 l
; S$ c. X1 l6 }" w2 V% |4 A) q
--------------------------------------------------------------------------------
$ G6 x" Q" Y7 o+ o* |
& S$ j. G' X# E9 k6 G6 g9 w
- \8 e2 |- Q E, z) p3 C
<BR> 跳下一行。
. n: S& x# L' r8 ?- V
如 : 华夏黑客联盟，<BR>网上学电脑的好去处。
2 v( A- s) N2 L% p% L5 s
华夏黑客联盟，
: v" h5 p `6 L1 {
网上学电脑的好去处。
1 `& g( f0 q j# s- Y# O
# J: x/ K/ k$ X7 y% `
6 r* Z4 T. w2 i5 M
<P>...</P> 段落，跳下一行并加一行空白。 ( </P> 可省略 )
9 F8 o, n \) }
如 : 华夏黑客联盟，<P>网上学电脑的好去处。
! `) ~9 x4 h) K- O. G L5 V! H
华夏黑客联盟，
0 v' l9 \8 R) J0 y( [3 B
% k# y6 ]" G. G. Z$ o% k
网上学电脑的好去处。
3 ~$ h8 k# J, S# [7 P
2 P& |" P/ r" y) o8 v6 _6 N- Q, l, b# z
2 s! q# G3 ^. d% H) z, ^* L9 U& f! g
<CENTER>...</CENTER> 置中。
5 U* h* ~! B: a& l& l/ ^$ `7 m
如 : <CENTER>置中</CENTER>
# P/ J" x5 i) I( J: R! o' t
: g4 `1 z' J0 [
+ X" ?$ t5 z1 @8 b5 a8 Q! ^
置中
6 D- K+ c& {5 G# p0 E0 c- ^
<NOBR>...</NOBR> 不跳下一行。
y/ q4 L# o' H6 \
如 : <NOBR>华夏黑客联盟，</NOBR>网上学电脑的好去处。
. D/ F M- y' H @8 p! L( K& m/ d
华夏黑客联盟，网上学电脑的好去处。
r3 E4 i+ Y3 j4 y; U* K
7 ~. i8 A& W! [+ F0 P) i
! M2 W. \# t$ h& x; x9 h
2 _& |$ v* F, U" J/ _
<PRE>...</PRE> 以文件原始格式显示。
9 p0 k x' C! n7 t( W
( b5 x# J. u; x6 J, A! T% q
如 : <PRE>原始格式: 文件</PRE>
" d. m% l d" R, H& m C
1 T3 r! S. v. q
! L& r* `+ M$ x
原始格式: 文件
T/ y& n2 ]3 {7 X j
7 m5 g" g6 H* Y0 ]! v
滚动条
2 s' T1 l& Z. @6 F% V
$ m- y$ I( A/ c, Z* e1 Z# P- E2 h+ A9 O
这是由IE提供的滚动条，可不要被众多的属性吓到了，越多的属性功能越强喔！
( \( {) N+ ?# j7 F# F
7 R6 U, q+ i! c. j/ D! W. ?
【文字卷动标记】
4 G0 } h4 `9 c% L" o5 i
5 l/ g- W' `, N! p( Y
<MARQUEE>…</MARQUEE> 文字卷动 ( 滚动条 )。
$ l- d/ z6 _* Y" ~! v
4 \. N. e0 i! M6 u
【相关属性】
' E$ l O0 U" Y% V3 D1 P7 t- R# U
- u+ ^) {: f6 w
·BEHAVIOR = 设定卷动方式
0 x- Q& n! o4 V9 Y! u) A
-- ALTERNATE 交替来回卷动
3 @$ u+ J7 |& g# C6 A( A
-- SCROLL 卷动 ( 预设 )
1 C- z/ n$ m; A: O0 u
-- SLIDE 滑动
5 f5 u3 c+ V( n, @8 [7 g$ f
1 Z6 g' f% w B1 r3 o9 w. p
·BGCOLOR = color 背景颜色
9 i0 M! Z0 l! w4 s, v
·DIRECTION = 设定卷动方向
5 d. q U# b- K" i
·HEIGHT = n 高度
3 K' [. t2 g% ?1 T
·LOOP = n 循环 , 卷动次数 ( 预设循环 )
& K6 L& q! s( z# F' y8 v! d4 V
·SCROLLAMOUNT = n 设定卷动距离
' q1 G: N5 W6 Q, n' U; b' x# d
·SCROLLDELAY = milliseconds 设定卷动时间
( t1 \8 Q9 ~+ @2 k- `
·TRUESPEED = milliseconds 设定卷动速度
M/ Z2 Y! ~2 o' N0 g& |% G
·WIDTH = n 宽度 ( 可设百分比% )
: d0 D3 \+ H3 g
; U/ Y$ o- k9 U1 ~
1 s) ~( b1 g/ g7 ~9 D& P' ]
【举例】
^% ^2 g; g; G% Z7 t
* ?6 |! B7 Z G
如 : <MARQUEE BGCOLOR=RED BEHAVIOR=ALTERNATE DIRECTION=LEFT SCROLLAMOUT=10 SCROLLDELAY=100> <FONT COLOR=WHITE>华夏黑客联盟</FONT></MARQUEE>
3 U7 I- O, o: ]3 L3 i9 Z
9 ] ]) ~5 N/ j: u
链接
+ W6 N( J0 l1 d+ h; e1 r1 t
: ]# q8 H. u8 a; G, J1 E# q7 g
链接可说是HTML中最重要的功能！因为HTML拥有链接的功能，使你能接上INTERNET、WWW ……享受多姿多彩的网络世界。
( c7 E" J+ [- k e E
基本上链接分成 :
: R: c3 ~) h+ l
- q$ |( o3 `/ M
外部链接——链接至网络的某个URL网址或文件，可参考考网络链接方式。
' C2 {6 K' P) s! e: g9 q1 [
内部链接——链接HTML文件的某个区段。
) B6 x) U8 x# E- P2 a# m& w
/ ^- N, ?2 u- g6 n5 f0 u& b J
网络链接方式
" l$ i6 [9 H+ G
/ N5 Z, L: z( \- P+ R+ D7 \& l
网络链接方式 : //主机名称 / 路径 / 文件名称
0 k+ k1 F8 y& {( b! C/ ~/ k8 z& g" Y
) b2 @% H( \5 W9 B4 a7 s) o
网址 如 : http : //www.hxhack.com/bbs/
+ f: o" K5 o% |$ |$ }2 e6 i
2 }0 i8 ]. U+ l7 a: i+ C- ]* R
文件传输 如 : ftp : //ftp.hxhack.com/bbs/
# a( \# }& @5 m$ b* V9 {! f$ l$ }
% g @, S1 |) {; y5 v6 X2 V3 G( R8 t
GROPHER 传输 如 : gropher : //gropher.net.cn/
5 E% B4 y; @8 N2 I' X
; y; @( T0 C9 P- b# G/ W& a0 |/ g
远端登入 如 : telnet : //bbs.net.cn/
; L- @9 ` X' t _! v, F8 H
& v2 t0 k/ d6 b. r( G8 N3 ~
文件下载 如 : file : //data/html/file.zip
8 c j4 c; p8 A# g# c
" `$ H5 T# C* D9 w, P# O* [1 V
NET NEWS 传输 如 : news : talk.hinet.net.cn
0 Y" U. ~+ C m9 i, l; e4 d
+ K7 B. A# C" q0 ], C
E-Mail 如 : mailto : ****@******.com.cn
* C/ b& ~% }5 ]
$ \, T- ` ?( \6 K9 D1 H
) ~4 @% a& i1 Q
常用链接标记
3 n F% i+ J$ ]* @# B
' ~$ @! x8 y; L- {0 j
<BASE> 设定基本URL位置或路径，以後只要设定文件名称即会自动加上位置或路径。
$ W$ n. F$ Y8 q1 e8 c6 P' v
相关属性 :
9 t0 o2 |. F7 p
·HREF 链接的URL位址或文件
[9 d9 k: E z' N! n7 o# W5 Y0 G ]$ C
·TARGET 指定链接到的URL位址或文件显示于那一个视窗 ( 可和 <FRAME> 视窗标记配合使用或开新的视窗 )
8 q& a# }- X+ G. M, G) y" P
8 d# F. g& _: q: t" w" p2 @, r9 {
如 :
/ J3 h$ \; d0 H! p) N8 l3 J
<BASE HREF="http://www.hxhack.com/bbs/">
, G6 l5 F0 {2 d1 u4 o& z
<A HREF="kk.htm">■</A>
! U' n. P8 B7 [) ~* Z
; }# ~7 ~' R" }
<BASE HREF="http://www.hxhack.com/bbs/" TARGET=frame1>
5 o; J& }' a: S) i, `+ |! @" n+ n
3 I; w) S0 m, q7 f+ h
, ~4 @) C$ `! y' E
<A>...</A> 链接指令。
) f; x4 D5 x+ ?1 `( A
相关属性 :
7 \+ w' @& d0 p7 V
·HREF 链接的URL位址或文件
$ b' l+ q, X1 U$ G
·NAME 名称
z5 E* ?0 P% j+ j2 v
·TARGET 指定链接到的URL位址或文件显示于那一个视窗 ( 可和 <FRAME> 视窗标记配合使用或开新的视窗 )
* P9 H+ M* {* p7 J. u8 ^ B
2 n$ d; m- `! k4 I& D( c8 ~
如 :
0 d- ?: |0 i* z4 U0 U" ^ c
外部链接
R; b$ d! j4 J7 }. r
<A HREF="http : //www.pconline.com.cn/">■</A>
, c o* o V5 }* c1 C. P
- b$ M4 Y* {! w# S z
<A HREF="http : //www.pconline.com.cn/" TARGET=frame1>■</A>
+ {% a V6 o; D, H; I2 I5 M
6 [+ @- G. b" r
内部链接
! S+ K2 m- Q0 h! ]0 S a( {1 D
·CH1.HTM 文件
1 j; v/ c& ]& Q( E) I
<A HREF=#A>■</A> ( 欲链接至HTML文件 A 点 )
b" s' L2 k6 c6 }5 Q& j y4 L
% w9 e! y% y8 E1 E3 p2 N
<A NAME=A>■</A> ( HTML文件 A 点 )
& v! a7 R( u+ J. y4 |4 v8 r
6 r% i& L3 F$ A. R' c
·CH2.HTM文件
1 C* O4 Z9 i3 `9 _ m; B
<A HREF=CH1.HTM#A>■</A> (欲链接至CH1.HTM 文件 A 点 )
0 Z2 K. l. p9 P
4 K3 M; C3 T. m3 l& A8 ?0 J* Z
" ■ " 表示链接点，可以是文字或图案。( 即游标移到时，会变成手指形状的地方 )
, s; G7 u4 Q# z& j" O6 g! X4 t! M
2 g' K2 n5 W8 q" u1 U6 H
. }1 u; Z# r' L6 w) O S5 m, }$ _6 d# D
<LINK> 链接指令 ( 用于HEAD区，设定CSS文件 )。 <META> 储存应用资讯，可设定时间载入网页 ( 用于HEAD区 )。
! W) M% {/ m3 e- F
相关属性 :
) |1 d+ I d/ A" O; Y' a8 J+ t# e
·CHARSET 设定
' g6 S) F0 L' e3 x$ B) y
·CONTENT 回应表头资料内容 , 若是数字表示秒数
3 l: v; s" q; u! u9 {
·HTTP-EQUIV 回应表头 , 若设定为REFRESH载入URL设定
' }' U* S& l( B. l8 G
·URL HTML位置
+ y! L% f# h, _2 I2 p8 G
8 ?$ Z. G0 D0 B! R1 c+ y! }" |
- g. \4 I* ~% B
如 :
7 K, }& A, c( i4 f1 g& d
·设定中文自动跳行。
: R. ^+ x B7 C E- x9 x
<META HTTP-EQUIV="Content-Type" CONTENT="text/html;charset=gb2312">
5 M/ k# `# }9 }% J
# q" S/ w* k4 \; T9 d+ @
·设定十秒回到首页。 ( 若不设定HTML文件位置则再载入原HTML文件 )
; f- n! @% L$ n4 H1 V) ]
<META HTTP-EQUIV="REFRESH" CONTENT=10 URL=index.htm>
4 m) o2 ^' k' B# k+ b5 x$ y: o
/ s* X) x4 b8 ?% a$ D' Q
+ h9 a6 l0 Z$ p' w7 v
设定链接、未链接部份颜色
7 z( w( \- j4 y: p$ e G' a1 @
/ M6 Y8 ]/ e e+ _# q* P4 M
设定链接、未链接部份颜色，用<BODY>...</BODY>标记。
, k. G& |0 Z3 w' {# C* `9 u9 @
. I2 M- X3 W- z+ Y+ j+ y
相关属性 :
2 M- \3 Q) l# b. Z* M
" z2 R( ^7 |( g2 r+ i$ L
·ALINK按下链接部份未放开时颜色
9 l6 y: A9 ^. ?; e4 w# q; G6 l
·LINK未看过的链接部份颜色
" b; S9 p, D5 n! }9 r1 x
·VLINK已看过的链接部份颜色
n5 q+ j3 I; [' y9 p0 q& L$ q' A
+ B( M- v- }1 Z/ R
如 : <BODY LINK=#0000FF ALINK=#FF0000 VLINK=#00FF00>
. m4 E7 x. ~6 I
6 w4 m2 ^: v+ Z# J4 G( M% J j5 Z
框架
2 j2 ]; ?# s) n! X% }
0 B ?! N$ G _( {6 b" r' N8 B" P
框架架构的标记，主要是分割窗口和插入浮动窗口的功能。如果能有效的运用将有助于浏览网页的效率！
( U4 h" ?3 n# m% {/ { R* v, ?
常用窗口标记
% L. n1 R) z1 [
& o' A7 i# L* i- v. A' w2 ?
<FRAMESET>...</FRAMESET> 定义分割窗口。
" A* z0 x* m9 L& W
相关属性 :
2 R1 |/ t Q6 P) H( G
·BORDER 边框
! z0 i' a2 I! P: a) T7 ^8 ^- A
·COLS 行 , 设定分割左右窗口宽度 ( 用『,』分隔，可设百分比 % ;『*』表示剩余部份 )
5 W4 E. y; c6 v
·FRAMEBORDER 显示边框
7 I! X) I5 j4 D! y0 ^, d
·ROWS 列 , 设定分割上下窗口高度 ( 用『,』分隔，可设百分比 % ;『*』表示剩余部份 )
3 |" a, W8 J1 |+ ?: k
$ T9 s" s/ X& r+ P9 Y5 a
( _) H2 Z$ ^0 d6 J
<FRAME> 定义窗口。
/ n5 g7 b E5 ?- u8 Y) h
相关属性 :
4 v! H3 C' X6 E$ @1 r5 I! M
·FRAMEBORDER 显示边框
' M9 z: V$ \% j3 t( H( a% W; x2 f
·NAME 名称
& \% {6 ^+ x' P( ~3 D5 v& ^
·NORESIZE 设定是否可以调整窗口大小
/ |6 }3 f" |8 W6 r: ~
·SRC 文件或URL位址
- r" a' y3 W1 q0 J. [4 h- m* P
·SCROLLING 设定是否可以卷动
, n! {* j% a3 M. L# b* }6 `
1 `/ m; S0 C' Q' Z0 P- C/ e
, L. G% ?" S! \+ T8 d0 ~4 b. _
<NOFRAMES>...</NOFRAMES> 无支援分割窗口浏览器显示文字。
0 p' V9 B, V" T" f2 H; ~% A
; x! E1 j7 W, }) r
<IFRAME>...</IFRAME> 插入浮动窗口。
% J/ @1 W2 z' r n8 `5 n+ r' R' t7 V" ^
相关属性 :
0 C, W7 q; q4 }
·BORDER 边框
2 E S" H, Q1 P+ i
·FRAMEBORDER 显示边框
- Z% y2 {* r2 N
·NORESIZE 设定是否可以调整窗口大小
2 u& ]" C5 C# ?* P
·SRC 文件或URL位址
x" X7 J! t2 H. k8 d9 c+ q/ k
·SCROLLING 设定是否可以卷动
# n8 K$ Z7 D* ?% O2 ?: [ B
: p7 h. ~9 a% \/ E" r, V& D) X
. H; I1 q9 r: [: N: f
举例
* U( { [ N' _+ S$ ]# N5 q
/ s* Z$ c' ?, j5 l, C! i
如 : 本站窗口架构。
3 q% r: [2 ~0 U1 C- ?
( 先分割成上下窗口，再于窗口各分割成左右窗口。 )
. j2 C6 O. ?1 L( \9 B Q7 O1 ^
<FRAMESET ROWS=74,* COLS=140,* FRAMEBORDER=NO BORDER=0>
7 f4 X+ ~( }! M D
<FRAME SRC=rad.htm NAME=RAD NORESIZE SCROLLING=NO>
8 {6 c# E5 b! x7 X; B7 j% d
<FRAME SRC=a-1.htm NAME=FRAME1 NORESIZE SCROLLING=NO>
2 V; z1 J1 l4 H. a: Z2 }
<FRAME SRC=b-1.htm NAME=FRAME2 NORESIZE SCROLLING=AUTO>
, {5 k5 `8 S+ _
<FRAME SRC=c-1.htm NAME=FRAME3 NORESIZE SCROLLING=AUTO>
l6 m8 R; f9 Q% ^
</FRAMESET>
) ]% y! c+ l* }; d
# z+ _+ a7 I4 V/ r8 |3 m! }8 `
如 : 浮动窗口
0 H7 o5 a1 t) l& x6 S6 @3 F
<CENTER>
& \, ^4 R- S1 Q! T6 H7 Q
<IFRAME FRAMEBORDER=YES SCROLLING=YES SRC=c1-01.htm>
' A2 Z0 f$ I1 j1 D1 m% v' ]1 \0 A$ Z
</IFRAME>
* e! H5 i& _4 a; D" {0 d. X7 I
</CENTER>
6 r3 n: F+ V$ R- u: a$ y
2 D2 j/ G% L4 y+ B
注意
6 F P4 O/ ]. u- g
5 x {6 h G* q* {' g: p% T2 {
窗口基本架构的文件，通常放在HTML文件的第一页，如 : index.htm 。此HTML文件的基本架构并不需要本文区 ( BODY )，只需定义窗口架构，而其他HTML文件可用连结方式 ( A HREF=...连结标记 TARGET属性 ) 显示于指定的窗口中。
2 [4 p5 \+ {- U( G& K- Y6 {
9 A2 D* G; \2 m* D% {: A5 F
设置图片
' V% E' h) l+ H$ z; L: {9 w# \6 p
" C' ^ i* j- U% C( s& m
现在的网站没有用图片的，几乎很少了吧！图片增加了网站版面的美观，不过也不要放了大量的图片，而拖慢网站传输的效率喔！
; \, M" ~. Y* N9 E F
! D' f' g7 Z" o, q6 V' V2 t8 G
有关设定图片的方法共有以下几种 :
9 ~9 C: K$ ~. B4 z" S0 k
2 M6 |. Y) R; X0 R/ Y+ P0 ?& f
, x$ |& h7 x8 n: ~
设定HTML文件背景图片、背景颜色。<BODY>…</BODY>标记。
& `% x2 G! @' T5 E* a
如 : <BODY BACKGROUND=A.GIF>…</BODY> 或
$ T& H! j# ^) u2 g
<BODY BGCOLOR=#000000>…</BODY>
, k- m! J% W0 K2 |# ^0 Y( M
设定图片。<IMG>标记。
3 _& Y% n0 Z- K3 A
设定地图。<MAP>…</MAP>标记。
7 U3 y9 D: i `! N, H% C
常用图片标记
" s( u" ~2 J1 G" i" N2 n
! b5 v* ^( L4 R! t6 G& n
<IMG> 指令
- |* A& j! P0 k* R8 q6 t$ L) d
相关属性 :
* p% O' }- `& [/ c$ F
·ALIGN 调整
- I# w6 k' f: x4 E3 r1 l* f
·ALT 提示字
7 ~+ K; \1 Y8 l) U! j+ h: S$ L
·BORDER 边框
- a+ C) N( U) t1 w
·HEIGHT 高度
6 r, w r2 j! {
·SRC 文件或URL位址
+ p. I! D- t7 }4 n! L7 L
·USEMAP 地图名称
+ h4 ^2 O/ S1 w; j1 O$ @
·WIDTH 宽度
. B9 M4 H8 N' [( N% z
: ~5 c( k' K9 C# d& p3 K; B
如 : 可插入图片 ( GIF、JPG格式 )、AVI电影
$ Z( H$ v: r/ A2 u7 X5 k" h
<CENTER>
5 p% B7 O3 j2 `# v! Y
<IMG SRC="../../../images/pcedu_lo.gif" ALT="华夏黑客联盟" ALIGN=TOP BORDER=1>
' L) ^- v3 f6 E' N% V: Y9 |8 D$ `
</CENTER>
; e! |/ t2 p' e& ]9 L, F
/ I2 I9 D, e. p7 ~0 h) @4 r$ t
! f" R& ^8 v2 W4 |+ z. |
- ~' s7 |4 U& O2 z1 Q' R
<MAP>…</MAP> 地图
1 `8 U: X& }, P% G# p/ i6 k4 |
相关属性 :
. r6 q/ \$ ~9 T) s
·NAME 名称
3 \/ B3 _5 E% l* k+ }& b
" X* ^: s- z8 p5 X
% z& ]4 r! e; h; k, } M% S; m
<AREA> 设定地图动作区域
# B8 a$ i6 \5 S2 p9 g X
相关属性 :
5 @# A9 }* p: |# w
·COORDS 设定动作区域座标 ( 左上角座标 : X1,Y1 ; 右下角座标 : X2,Y2 )
+ Y" y: ], @+ W; U$ ?
·HREF 动作区域连结点 ( 可载入位址或文件 )
8 W0 ?# s7 l, j7 @0 C, O/ \4 M- j( N
·NOHREF 动作区域连结点不动作
( B5 \ C( ?1 Z* O3 _' L
·SHAPE 外型
" l. E1 C$ T2 q: ?. v# r
1 L( Q) L, `, N& Z5 W
* H G! y# J) Q5 M+ b+ z. q
举例
5 ^# Z9 o0 W3 ^ G
6 T3 F7 U: h1 c3 j
设定地图
# ?0 H( l$ n& O5 a# q$ v
<IMG BORDER=0 SRC=A.GIF USEMAP=#A>
8 a, u) J! E4 c; Q# f
<MAP NAME=A>
$ o. f3 b+ I( |. X4 _ z
<AREA SHAPE=RECT COORDS=0,0,200,100 HREF=1.HTM>
5 C* t( x8 |% @4 | I8 D
<AREA SHAPE=RECT COORDS=0,100,200,200 NOHREF>
. I, N: A, e4 k2 N6 G4 V# P! B
<AREA SHAPE=RECT COORDS=0,200,200,300 HREF=3.HTM>
1 r& ]) P' b1 }0 T, k K
</MAP>
$ N+ [" r: I% ^4 H0 `, \" b
, Y' I8 v$ Z7 ^% M E
加入声音
% D/ Z! p/ g# d) A, ]6 l
( Z& z2 b% k2 S& n) _
HTML不仅能插入图片，也可以载入MIDI音乐、WAV 音效喔！
6 x7 E% k; Z5 Q
常用音乐标记
+ u& g- s+ a4 W7 u- p2 p
1 Y( v8 [: J2 G/ I0 }
<BGSOUND> 背景音乐、音效。
5 p; x, Q2 Q8 U5 Y( q. S
* d: X9 x1 V6 E! [
相关属性 :
/ g& r9 o& O4 d8 ~% z* }0 M& G1 {2 r
·LOOP 循环 , 背景音乐播放次数
; r& n+ k& z- Z6 q1 I, k8 g
·SRC 文件或URL位址 (可为WAV、MIDI格式 )
5 t) {7 N, m- @4 r8 w
: K7 f) Y9 A9 f f' r
如 :
( o/ H6 W( r, t4 Z' i
<BGSOUND SRC=m-1.mid LOOP=True>
! `$ T3 x% d- w7 z4 e4 P3 x* ^
( O* s" A+ z& {# o& s
内嵌音乐插件
3 x8 S: c2 B n; d- m
1 U: h: @1 T- }' V; y
<EMBED>…</EMBED> 内嵌插件。
4 e+ h6 ?2 e" b( D
) ]6 I( o. P4 u- q7 @: X& K6 F
相关属性 :
+ x2 s8 v* K A9 G% w( l
·HEIGHT 高度
\; i% f& x' Y1 x3 C; ~8 G2 y9 ~' c
·WIDTH 宽度 ( 可设百分比% )
: b& R7 H8 W( _1 R; G/ a7 y* M
·SRC 设定内嵌物件的 URL 位址
3 V. _4 `, z- @3 L: y
·LOOP 循环 , 背景音乐播放次数
I; U" c" o9 o& V
·AUTOSTART 自动播放
] F' g) O# m! i: p
1 G; ]& g5 E( l6 ]' V" ^
如 :
3 I5 {2 X0 V/ o1 p, |, L
<EMBED SRC=m-1.mid WIDTH=145 HEIGHT=60 AUTOSTART=True LOOP=True></EMBED>
作者:
chnzw520
时间:
2009-10-16 01:18
小俊
$ u% c; M) ]8 R
你这不是发帖
, b' f' l# @( t! I) B0 k' H
你这是发寂寞
作者:
月中水
时间:
2009-10-16 01:20
谢谢！！
哈哈！！！
欢迎光临 飞翔无限fxwx.com广西经贸职业技术学院论坛 (http://gxjmbbs.com/)
Powered by Discuz! X3.2
小俊$ u% c; M) ]8 R 哈哈！！！