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