返回列表 回复 发帖

[分享] 基础html代码大全参考

1.结构性定义
* P0 [1 I: ^& a
# G( x8 t) G7 e4 j, K9 Q文件类型 <HTML></HTML> (放在档案的开头与结尾) ! b2 F5 F: [  F
文件主题 <TITLE></TITLE> (必须放在「文头」区块内)
' l4 Q  _7 ~( X3 I文头 <HEAD></HEAD> (描述性资料,像是「主题」) 2 z7 _, @5 J3 W1 o5 _4 q, F! _
文体 <BODY></BODY> (文件本体) ! L. M& z8 \0 |; I2 b
(由浏览器控制的显示风格) : E: [: s9 M' f3 k. _
标题 <H?></H?> (从1到6,有六层选择) # Q* c3 K  U3 u$ j7 p# ]
标题的对齐 <H? ALIGN=LEFT|CENTER|RIGHT></H?>
& m% K! g- M# B( P# E9 Q区分 <DIV></DIV>
2 L4 l$ q) i! N& v区分的对齐 <DIV ALIGN=LEFT|RIGHT|CENTER|JUSTIFY></DIV>
0 ~: \% K' \( \5 D: j& e) d引文区块 <BLOCKQUOTE></BLOCKQUOTE> (通常会内缩) 5 b0 g" o+ ~* z7 W9 a  F, k) e) n
强调 <EM></EM> (通常会以斜体显示) , d3 L) P% ]- l! F2 \4 U, n9 r4 v
特别强调 <STRONG></STRONG> (通常会以加粗显示) ; N- ?. S# }3 w; Y
引文 <CITE></CITE> (通常会以斜体显示) : _( t9 I2 Q' J  I+ n/ g8 a4 l
码 <CODE></CODE> (显示原始码之用)
. J; C& Y$ }9 B5 K样本 <SAMP></SAMP> 5 w- d! K6 s; L
键盘输入 <KBD></KBD> 7 ~) ]" `8 L, S! y" \
变数 <VAR></VAR>
! n" U# V/ B( O- w* F定义 <DFN></DFN> (有些浏览器不提供)
# R0 }8 y6 a% w* s$ j. E地址 <ADDRESS></ADDRESS>
7 C1 o# m, J+ `! v& Y# b* `大字 <BIG></BIG> - _2 K) d2 g& ?& O  m6 e& Y% U' u
小字 <SMALL></SMALL>
  M( @( X/ |& T" G) s与外观相关的标签(作者自订的表现方式) + l! _3 ?! P: P2 c; Z+ S+ I/ l2 i
加粗 <B></B>
3 u8 O! H: _! G- e) G$ X* x/ f斜体 <I></I> 3 C( V$ V/ t, M: @
底线 <U></U> (尚有些浏览器不提供)   Y- A4 r9 ?* L5 B
删除线 <S></S> (尚有些浏览器不提供)
7 t# B! \6 H+ {, P1 z% N下标 <SUB></SUB>
: B" ^  P( |: b( \8 Y6 y+ f4 S( b3 G上标 <SUP></SUP> $ L. ?' n- T8 H0 |& X
打字机体 <TT></TT> (用单空格字型显示) ( A* M+ y6 @; n: l2 T
预定格式 <PRE></PRE> (保留文件中空格的大小) + s3 s0 @" p7 T% t0 a& h) x; k7 @
预定格式的宽度 <PRE WIDTH=?></PRE>(以字元计算) * g. b7 S. q6 H' X  E7 D
向中看齐 <CENTER></CENTER> (文字与图片都可以) ; Q$ ~+ a' i8 @% d/ z
闪耀 <BLINK></BLINK> (有史以来最被嘲弄的标签) ( Q" l( o0 `6 |0 N$ f
字体大小 <FONT SIZE=?></FONT>(从1到7)
8 J" y/ B% a6 I! i, ?# u改变字体大小 <FONT SIZE=+|-?></FONT>
+ ~( Z, t* g/ R, x0 e( H基本字体大小 <BASEFONT SIZE=?> (从1到7; 内定为3) , v1 t& V% i+ c% E
字体颜色 <FONT COLOR="#$$$$$$"></FONT> 1 K# E& |) T/ G% b$ w2 T1 f. \

' J3 i) i! V9 u% F9 ^' v1 J' u2.连结与图形 8 O" F/ T% {8 t( E. t0 t' W' C
0 z3 M. ]/ s+ N2 Z: e) `
连结 <A href="/URL"></A> ) ~5 d* M6 |7 A7 r4 a0 z7 @
连结到锚点 <A HREF="URL#***"></A>(如果锚点在另一个档案)
  x4 b; c# s7 T9 |9 M, T+ T<A HREF="#***"></A> (如果锚点目前的档案) 7 ]/ R, V( @2 j) [' K
连结到目的视框 <A href="/URL" TARGET="***"></A> - R- |+ y* D2 P# x3 L  x! b
设定锚点 <A NAME="***"></A> ' S8 T2 w0 z/ X# v, ~' X6 ~  A
图形 <IMG src="/URL"> % J, j7 z  d+ ?, T
图形看齐方式 <IMG src="/URL" ALIGN=TOP|BOTTOM|MIDDLE> 1 ?- w$ P; d# M, T
图形看齐方式 <IMG src="/URL" . [. {5 l; P, Y' T
ALIGN=LEFT|RIGHT|TEXTTOP|ABSMIDDLE|BASELINE|ABSBOTTOM> / N! |4 @- L' N- X6 n; ]0 U
取代文字 <IMG src="/URL" ALT="***"> (如果没有办法显示图形则显示此文字) ) \; }; B/ V9 C4 U
点选图 <IMG src="/URL" ISMAP> (需要CGI程式) ( |* _" V$ R8 W2 V4 G1 [
N2.0 点选图 <IMG src="/URL" USEMAP="URL"> 4 p3 V% B+ K4 M+ D8 D
N2.0 地图 <MAP NAME="***"></MAP>(描述地图)
  S: n0 i6 }7 O0 C! a: EN2.0 段落 <AREA SHAPE="RECT" COORDS=",,," href="/URL"|NOHREF> 5 S/ [* N" T  y( U
3.0 大小 <IMG src="/URL" WIDTH="?" HEIGHT="?">(以pixels为单位) N1.0 图形边缘 <IMG src="/URL" BORDER=?> (以pixels为单位)
- K/ S: c9 q9 \( u# j$ M  R2 KN1.0 图形边缘空间 <IMG src="/URL" HSPACE=? VSPACE=?> (以pixels为单位)
& t& r( q4 i7 W5 M8 G9 vN1.0 低解析度图形 <IMG src="/URL" LOWsrc="/URL">
! O( q7 l1 Q* w4 M% q$ e6 v* R8 FN1.1 用户端拉 <META HTTP-EQUIV="Refresh" CONTENT="?; URL=URL">(使用端自动更新 ) ' {3 Z4 ?3 r2 N9 O
N2.0 内嵌物件 <EMBED src="/URL"> (将物件插入页面) / H" p( Q$ _) w& K2 n
N2.0 内嵌物件大小 <EMBED src="/URL" WIDTH="?" HEIGHT="?">
; f+ y/ E0 ]7 v- N
  O, Z! n$ F5 b$ P: O0 e3.分隔! X0 R9 b3 p/ ~$ Y* a
. `3 J: K; D/ @: ^0 T: N9 h. P
段落 <P> (通常是两个return)
5 V: ]; ~/ c2 \: i. @3.0 段落 <P></P> (新定义成容器型标签)
( u5 n3 n+ Q; J, Z  q' {3.0 文字看齐方式 <P ALIGN=LEFT|CENTER|RIGHT></P> 5 n% M% I+ B9 H! q- _
换行 <BR> (一个return) ) l1 m  S0 D. ?# V
N1.0 文字部份看齐方式<BR CLEAR=LEFT|RIGHT|ALL>(与图形合用时)
5 E1 h+ E6 V$ C' ]# f横线 <HR> 8 M# j) f2 f3 s
N1.0 横线对齐 <HR ALIGN=LEFT|RIGHT|CENTER>
& R/ u. q" U" j  p. aN1.0 横线厚度 <HR SIZE=?> (以pixels为单位) ! C; d: x( z0 ]+ T, O
N1.0 横线宽度 <HR WIDTH=?> (以pixels为单位) 9 @0 ~4 E& N5 y7 m9 k! r
N1.0 横线比率宽度 <HR WIDTH=%> (以页宽为100%)   K2 c0 A: A' X
N1.0 实线 <HR NOSHADE> (没有立体效果) - N8 M' X  q% Q. ?( y) ~2 c) Y* R
N1.0 不可换行 <NOBR></NOBR> (不换行)
2 ]8 t1 m+ b7 c! O; f2 [/ \, w4 _N1.0 可换行处 <WBR> (如果需要,可在此断行)
3 t& y. v# E, C% G+ x列举 (可以巢状列举)
/ @1 r# ]) Y9 C无次序式列举 <UL><LI></UL> (<LI> 放在每一项前)
+ X0 _4 g8 N" h! }$ e- M% ^$ r6 JN1.0 公布式列举 <UL TYPE=DISC|CIRCLE|SQUARE>(定义全部的列举项) 4 k* U; {1 G+ e5 L
<LI TYPE=DISC|CIRCLE|SQUARE>(定义这个及其後的列举项) + ~6 B' Z* y9 E, B# Q: R! S& F: o& C
有次序式列举 <OL><LI></OL> (<LI> 放在每一项前)
6 X. Z2 f7 E! LN1.0 数标型态 <OL TYPE=A|a|I|i|1> (定义全部的列举项) 9 l" L3 P( }3 N* V
<LI TYPE=A|a|I|i|1> (定义这个及其後的列举项)
: R9 O2 H# z) I- y6 tN1.0 起始数字 <OL value=?> (定义全部的列举项) 7 G- Z, a* \/ C, \$ Z" D
<LI value=?> (定义这个及其後的列举项)
5 i- Y) `( z5 k- U定义式列举 <DL><DT><DD></DL>(<DT>项目, <DD>定义)
' L7 O4 J3 Z. P0 @- _, W, k) K表单式列举 <MENU><LI></MENU>(<LI> 放在每一项前)
& T+ l9 F  P' |# L. ]- h目录式列举 <DIR><LI></DIR> (<LI> 放在每一项前) 7 O; k% I% h% H% H. y$ n: f
背景与颜色
+ W+ z( K$ Q  D5 ?1 [- r3 y8 g% o3.0 重复排列的背景 <BODY background="/URL"> " m& W: M' j) Z0 J' s
N1.1+ 背景颜色 <BODY BGCOLOR="#$$$$$$"> (依序为红、绿、蓝) 8 P1 b6 {/ \1 q) e- l
N1.1+ 文字颜色 <BODY TEXT="#$$$$$$"> , q8 o2 P1 K& H
N1.1+ 连结颜色 <BODY LINK="#$$$$$$">
, |# l. }7 b# n& O- N6 u# S8 rN1.1+ 看过的连结 <BODY VLINK="#$$$$$$"> $ S* z% V5 |2 r  v
N1.1 使用中的连结 <BODY ALINK="#$$$$$$"> & z% W2 r5 h9 W6 p9 _9 ^8 U+ |, H

# ~7 t8 G, J7 {4.特殊字元(以下标签需用小写) % G' X, d7 x+ [
& [8 i  \6 D9 Y- t) \" V
特别符号 &#?; (其中 ? 代表 ISO 8859-1 的编码) : Q0 C; P3 _9 l: v" j
< < > > & & " "
! t  @5 d) d* q( c注册商标TM ?   A% f* h0 ?: z  E
N1.0+ 注册商标TM ? ( r  m' w6 S" ?
著作权符号 ?
2 C2 V! l% ~0 z1 @- a9 }  wN1.0+ 著作权符号 ? 1 h' f, W; a  ^

3 r! t7 b) h( p5.表单 (通常需要与CGI程式配合) * J: Y6 t- E" D" ?# [( A0 Y6 Z

: h- _/ ?0 L; C+ a% _定义表单 <FORM ACTION="URL" METHOD=GET|POST></FORM>
/ }% k7 h) Z$ Q8 t3 GN2.0 上传档案 <FORM ENCTYPE="multipart/form-data></FORM> ) P" J& F% D7 B! Q( H4 M
输入栏位 <INPUT TYPE="TEXT|PASSWORD|CHECKBOX|RADIO|IMAGE|HIDDEN|SUBMIT|RESET">
2 A7 t- u8 [- s! G" D( z栏位名称 <INPUT NAME="***">
% J) d0 s' p8 J- ]4 P栏位内定值 <INPUT value="***"> % y; v5 B5 ~; ?7 f- \
已选定 <INPUT CHECKED> (适用於checkboxes与 radio boxes) / J* Z+ R) Z8 s; b
栏位宽度 <INPUT SIZE=?> (以字元数为单位)
' a0 k, Y: y* F4 }最长字数 <INPUT MAXLENGTH=?> (以字元数为单位) 8 p7 c  q; S) ~+ ^! n
下拉式选单 <SELECT></SELECT>
( z3 _) Z8 f4 o5 F0 J. M下拉式选单名称 <SELECT NAME="***"></SELECT>   X, ~1 K6 [  e3 K9 ?
选单项目数量 <SELECT SIZE=?></SELECT> 0 u% {0 J( W7 t+ T
多选式选单 <SELECT MULTIPLE> (多选) & _9 m" X  k3 b  A: G8 z
选项 <OPTION>
, V: e/ ^9 `. z3 y; N4 O内定选项 <OPTION SELECTED>
, Y0 W. }! I5 p  |  j文字输入区 <TEXTAREA ROWS=? COLS=?></TEXTAREA> ; F7 r! G) g6 A( b4 W* v
输入区名称 <TEXTAREA NAME="***"></TEXTAREA>
- c3 [3 B" D( m5 c, S/ NN2.0 输入区换行方式 <TEXTAREA WRAP=OFF|VIRTUAL|PHYSICAL></TEXTAREA> 7 i, r( Y; V  R* Z, j5 c- J4 c
" {4 f1 `  E& m: [5 ^2 Y
6.表格 6 U7 y8 K& q' C
: e3 }3 K% ?; a+ H. F" o$ T
3.0 定义表格 <TABLE></TABLE>
+ _3 i9 v- [. G/ P/ n! b3 U) e3.0 表格框线 <TABLE BORDER></TABLE> (有或没有) ' H+ x6 P, G: p4 [3 N7 }7 R
N1.1 表格框线 <TABLE BORDER=?></TABLE>(可以设定数值)
' ?4 b9 |7 m. x. Q" }N1.1 储存格左右留白 <TABLE CELLSPACING=?>
5 y. f% a- G5 i  IN1.1 储存格上下留白 <TABLE CELLPADDING=?> & f6 c7 T7 B. ~) O6 p& k: |6 o4 H
N1.1 表格宽度 <TABLE WIDTH=?> (以pixels为单位)
1 H* g$ T0 h) \6 cN1.1 宽度比率 <TABLE WIDTH=%> (页宽为100%)
% U6 H0 W9 e4 Y+ a* k. m% f/ v" U; e3.0 表格列 <TR></TR> 1 U2 T, f' u6 M0 M8 c& I3 V" y  C
3.0 表格列内容看齐 <TR ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM> ! x' m! N( p  i; Z: C
3.0 储存格 <TD></TD> (须与列并用)
) P; R# V9 @4 z1 b+ N  u% b3.0 储存格内容看齐 <TD ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM> , K, ?1 c+ U1 K" j8 y0 M
3.0 不换行 <TD NOWRAP> & z% g8 I- Q2 p6 T
N3.0 储存格背景颜色 <TD BGCOLOR=#$$$$$$>
8 n" T* ?8 e* s2 \, z3.0 储存格横向连接 <TD COLSPAN=?>   n% }2 Y1 n8 `: O0 b
3.0 储存格纵向连接 <TD ROWSPAN=?>
4 v# k( m; j/ i8 ~+ n& F0 o8 EN1.1 储存格宽度 <TD WIDTH=?> (以pixels为单位) 0 |) F' R& n# T0 r# E4 ~0 O. J9 j
N1.1 储存格宽度比率 <TD WIDTH=%> (页宽为100%) . ~1 v. b/ @9 R8 V
3.0 表格标题 <TH></TH> (跟<TD>一样,不过会对中并加粗) - H! c6 u0 P/ ~
3.0 表格标题对齐 <TH ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM> $ H7 c; J% l' F8 M! k, x
3.0 表格标题不换行 <TH NOWRAP> ! l3 y6 T- [, O( _
3.0 表格标题占几栏 <TH COLSPAN=?> * s; O+ X) j6 D
3.0 表格标题占几列 <TH ROWSPAN=?> 4 V  U+ j9 F5 B5 _) X( I
N1.1 表格标题宽度 <TH WIDTH=?> (以pixels为单位) 2 e$ t4 g/ d1 o
N1.1 表格标题比率宽度<TH WIDTH=%> (页宽为100%)
7 K8 O7 T! I; f, ]; z3.0 表格抬头 <CAPTION></CAPTION>
" c! |+ \! n' W- ]7 \3.0 表格抬头看齐 <CAPTION ALIGN=TOP|BOTTOM>(在表格之上/之下)
& c0 P$ P  ~9 T1 y& y$ a$ o9 X7 R$ ^视框 (定义与控制萤幕上的特定区域) 9 O0 k6 s. y) z( f
N2.0 视框格式总定义 <FRAMESET></FRAMESET> (取代<BODY>)
6 J0 P, D& x. l: D4 n0 C5 g4 AN2.0 视框行长度分配 <FRAMESET ROWS=,,,></FRAMESET>(pixels 或 %)
4 Z" X2 \: K. P; W5 rN2.0 视框行长度分配 <FRAMESET ROWS=*></FRAMESET> (* = 相对大小)
/ o( p4 x7 `/ F; ?N2.0 视框栏宽度分配 <FRAMESET COLS=,,,></FRAMESET>(pixels 或 %) 9 C' C8 o- n. _# \
N2.0 视框栏宽度分配 <FRAMESET COLS=*></FRAMESET> (* =相对大小)
2 R8 I# }: V; N0 @N2.0 定义个别视框 <FRAME> (定义个别视框) $ q& S, R& m* [5 s, @- N& I
N2.0 个别视框内容 <FRAME src="/URL">
6 a) n4 @* S3 {( C2 E+ J! |N2.0 个别视框名称 <FRAME NAME="***"|_blank|_self|_parent|_top> % {; t/ N; r3 N$ h5 d5 o1 F/ U" V
N2.0 边缘宽度 <FRAME MARGINWIDTH=?> (「左」与「右」边界)
) M& u" s' V0 @6 [" v  A& J, `N2.0 边缘高度 <FRAME MARGINHEIGHT=?> (「天顶」与「地底」边界)
- x9 A8 f# Q# O4 W3 qN2.0 卷动条 <FRAME SCROLLING="YES|NO|AUTO">
3 J& c+ r6 s" x2 h' {N2.0 不可改变大小 <FRAME NORESIZE> - P+ Y0 ~8 v$ D
N2.0 无视框时的内容 <NOFRAMES></NOFRAMES>(如果浏览器不提供视框功能的话)
怨去吹箫,狂来说剑,两样销魂味。
好东西啊,不错不错,存上先,用的时候复制粘贴
返回列表