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