返回列表 回复 发帖

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

1.结构性定义
8 A( i* N: k, Z, m& X
" E! `) b5 ~$ C; G. z  y" @& k# S文件类型 <HTML></HTML> (放在档案的开头与结尾)
2 _, R8 G' U( H, @% ]: f文件主题 <TITLE></TITLE> (必须放在「文头」区块内) / y& f; f9 |" t, t  q
文头 <HEAD></HEAD> (描述性资料,像是「主题」)
) Z1 ^9 L6 w! S5 v* {# l* C文体 <BODY></BODY> (文件本体) 6 K7 C) u8 n- N
(由浏览器控制的显示风格)
6 R. b# s; {1 A- @9 r5 i# N标题 <H?></H?> (从1到6,有六层选择) & a4 _/ K( B; ?0 C, t1 L( I
标题的对齐 <H? ALIGN=LEFT|CENTER|RIGHT></H?>
2 J4 d% ^" v. o区分 <DIV></DIV>
! {% A3 f% H$ _0 @0 A3 r区分的对齐 <DIV ALIGN=LEFT|RIGHT|CENTER|JUSTIFY></DIV> 8 _0 @9 F6 f# G0 j
引文区块 <BLOCKQUOTE></BLOCKQUOTE> (通常会内缩) ' {5 z2 |0 O/ Y  I. J. w2 C* @; I  ~
强调 <EM></EM> (通常会以斜体显示) . j4 C$ V. o: c; V
特别强调 <STRONG></STRONG> (通常会以加粗显示) + w" v; q. [  n% ?; x/ l8 |1 A/ F/ U
引文 <CITE></CITE> (通常会以斜体显示)
3 }6 L0 v0 N$ Z! x$ D1 @' f码 <CODE></CODE> (显示原始码之用)
! }' ?* O* }9 X. ]1 \  Y  `( F样本 <SAMP></SAMP> ; T( p7 b2 m. E% a
键盘输入 <KBD></KBD> ! F6 r8 h2 v* V
变数 <VAR></VAR> $ \- |6 N$ P  i7 E; O
定义 <DFN></DFN> (有些浏览器不提供) % P0 _& e& v8 @
地址 <ADDRESS></ADDRESS>
5 x- n) ]0 g# C6 ^& ^% }大字 <BIG></BIG> ! s# r$ Y: i; U- U8 S# u, [+ \$ z" ~
小字 <SMALL></SMALL> - w$ {7 o# r4 Y
与外观相关的标签(作者自订的表现方式) 5 |7 w% Z$ j1 L! X) b( r
加粗 <B></B> # }: v/ b  Q  J" e1 }) @& }
斜体 <I></I>
, F# l! D7 M: ]0 O$ d8 U/ d底线 <U></U> (尚有些浏览器不提供) 0 H% d9 _( o. m/ m; S+ S1 J. E
删除线 <S></S> (尚有些浏览器不提供) 9 C: J0 h: I# U& K
下标 <SUB></SUB>
: [2 o9 q, A8 Y0 _7 f3 \上标 <SUP></SUP>
0 V. q' d0 x- U  z% L% V* N( N打字机体 <TT></TT> (用单空格字型显示)
, m. a. I- I: t8 S* L: r. ^预定格式 <PRE></PRE> (保留文件中空格的大小) 3 m1 @! ?4 w/ J$ I" q! K  ^# x
预定格式的宽度 <PRE WIDTH=?></PRE>(以字元计算)
' K! ?! s( q% F% k# F向中看齐 <CENTER></CENTER> (文字与图片都可以) ; j& L( l# b$ C
闪耀 <BLINK></BLINK> (有史以来最被嘲弄的标签)
+ s7 Q7 `9 \' q! X( T* C字体大小 <FONT SIZE=?></FONT>(从1到7)
  r: }" A6 m0 K8 V改变字体大小 <FONT SIZE=+|-?></FONT> ) @7 i8 t; h# N- b5 g
基本字体大小 <BASEFONT SIZE=?> (从1到7; 内定为3)
0 z6 t' E* ]7 t  X5 C) P字体颜色 <FONT COLOR="#$$$$$$"></FONT> ) Y% c4 }$ w; D/ w

! Q- |* e) R' ~3 I: p2.连结与图形 + T9 X6 Y; _& n# c) v& B. e4 ~
' z3 {, C; @  V+ o+ k
连结 <A href="/URL"></A> 2 V1 ]4 ^* T1 k  X; z6 O
连结到锚点 <A HREF="URL#***"></A>(如果锚点在另一个档案)
( O1 ]5 L4 j" t# E<A HREF="#***"></A> (如果锚点目前的档案)
( w) m  S0 [- P  J' H. {& `: S连结到目的视框 <A href="/URL" TARGET="***"></A>
; Q- T4 x( Y% T% l设定锚点 <A NAME="***"></A> 2 D2 u7 N/ T2 I) V/ p' H. t. F
图形 <IMG src="/URL">
9 ?3 o( t% W" O0 X5 H* J图形看齐方式 <IMG src="/URL" ALIGN=TOP|BOTTOM|MIDDLE>
1 h, g; |6 q1 n. G* y  Y7 ~2 Q% v图形看齐方式 <IMG src="/URL"
* q2 L- N9 M  s1 W: G6 qALIGN=LEFT|RIGHT|TEXTTOP|ABSMIDDLE|BASELINE|ABSBOTTOM>
1 y7 m" c& ]( x9 ~/ ?0 h取代文字 <IMG src="/URL" ALT="***"> (如果没有办法显示图形则显示此文字)
: O$ y! \/ a! v: L/ X" M点选图 <IMG src="/URL" ISMAP> (需要CGI程式) 7 R2 S+ N9 o) [( Z" w7 c5 o
N2.0 点选图 <IMG src="/URL" USEMAP="URL">
7 S+ |* L. q" {3 e- }' ?N2.0 地图 <MAP NAME="***"></MAP>(描述地图) 8 B4 D! U  e, B4 s3 X; z3 T, o8 |: w. y
N2.0 段落 <AREA SHAPE="RECT" COORDS=",,," href="/URL"|NOHREF> 6 [. F7 ~; O" b' c
3.0 大小 <IMG src="/URL" WIDTH="?" HEIGHT="?">(以pixels为单位) N1.0 图形边缘 <IMG src="/URL" BORDER=?> (以pixels为单位)
8 i$ n# C$ `; L" N/ _N1.0 图形边缘空间 <IMG src="/URL" HSPACE=? VSPACE=?> (以pixels为单位) ' @& N+ e' a; j
N1.0 低解析度图形 <IMG src="/URL" LOWsrc="/URL">
2 ^. v# d6 h  U2 m  q- T- g9 oN1.1 用户端拉 <META HTTP-EQUIV="Refresh" CONTENT="?; URL=URL">(使用端自动更新 )
; E# f) M1 R8 l1 b$ UN2.0 内嵌物件 <EMBED src="/URL"> (将物件插入页面) " I2 j, O  ~" {5 u7 i- H9 t
N2.0 内嵌物件大小 <EMBED src="/URL" WIDTH="?" HEIGHT="?"> ' i  @# B) p3 E! U
8 E8 Y4 U; R" U# w
3.分隔. e) j; v9 N9 n
# U8 q# ~( F# l* Z& z( M4 s
段落 <P> (通常是两个return)
: ^1 e, d9 P. m3.0 段落 <P></P> (新定义成容器型标签) 8 `/ g3 ^; n  X8 a. J$ P+ N
3.0 文字看齐方式 <P ALIGN=LEFT|CENTER|RIGHT></P> 7 z2 N6 x* A$ O" e' }
换行 <BR> (一个return) 0 Q- }- T, `5 t2 ?+ }( c
N1.0 文字部份看齐方式<BR CLEAR=LEFT|RIGHT|ALL>(与图形合用时) - i/ M  R3 y3 k1 {3 A
横线 <HR> 0 A' o; b9 G! \& D$ T7 {  u
N1.0 横线对齐 <HR ALIGN=LEFT|RIGHT|CENTER> ! x1 K9 e, k/ N5 m1 c6 T' f9 w
N1.0 横线厚度 <HR SIZE=?> (以pixels为单位)
4 I- t/ z( l- U  O! E% }( V6 vN1.0 横线宽度 <HR WIDTH=?> (以pixels为单位) / y' r  f- j# Z7 X
N1.0 横线比率宽度 <HR WIDTH=%> (以页宽为100%) $ x% c0 f5 R  U# x, h8 h2 z5 [8 r
N1.0 实线 <HR NOSHADE> (没有立体效果) + y& U* O5 ]; K+ L. V2 \
N1.0 不可换行 <NOBR></NOBR> (不换行) 9 a9 J  o" O$ }* X5 A1 P
N1.0 可换行处 <WBR> (如果需要,可在此断行)
8 S5 X0 E' x9 s7 Y) X: \; N列举 (可以巢状列举) - ^, p, v% t3 M- w( L. K
无次序式列举 <UL><LI></UL> (<LI> 放在每一项前) ' N. `! u; M' R
N1.0 公布式列举 <UL TYPE=DISC|CIRCLE|SQUARE>(定义全部的列举项) 8 V# T, J# b+ k% s! ^
<LI TYPE=DISC|CIRCLE|SQUARE>(定义这个及其後的列举项)
* |: _0 P8 y" `% X+ a# d) K有次序式列举 <OL><LI></OL> (<LI> 放在每一项前)
- t+ Z6 t/ B/ N% w  I: B. qN1.0 数标型态 <OL TYPE=A|a|I|i|1> (定义全部的列举项)   J5 \9 I5 V! t4 p
<LI TYPE=A|a|I|i|1> (定义这个及其後的列举项)
( [2 U. m; s' `+ y0 @N1.0 起始数字 <OL value=?> (定义全部的列举项) 5 @- G9 {# c# s% @% B# ]
<LI value=?> (定义这个及其後的列举项) 7 R6 q' T+ n2 K( r$ h
定义式列举 <DL><DT><DD></DL>(<DT>项目, <DD>定义) 6 B" z, ^% m# \3 V
表单式列举 <MENU><LI></MENU>(<LI> 放在每一项前)
" D3 l( {, c$ D* T: }) d# `7 F目录式列举 <DIR><LI></DIR> (<LI> 放在每一项前) ( l0 F7 }, v! M6 u
背景与颜色
* b2 e* O* j8 _- T$ v3.0 重复排列的背景 <BODY background="/URL"> + e5 R( b4 G7 D+ e. x/ k
N1.1+ 背景颜色 <BODY BGCOLOR="#$$$$$$"> (依序为红、绿、蓝) - \9 }1 i& d( a+ {
N1.1+ 文字颜色 <BODY TEXT="#$$$$$$"> 1 L8 [" M( S/ K3 J: Y* r( T
N1.1+ 连结颜色 <BODY LINK="#$$$$$$">
7 o- [9 E8 M! y! k$ R% R$ f4 j) [% k8 S) }N1.1+ 看过的连结 <BODY VLINK="#$$$$$$"> 4 l5 |0 V; u, W* H- ^* _
N1.1 使用中的连结 <BODY ALINK="#$$$$$$"> 9 e8 H& Q/ }( d5 _

4 g$ P9 }9 y2 w6 a2 v( M) X4.特殊字元(以下标签需用小写) , G  ]$ e3 p& x2 _
( J+ r& N% G5 ^0 @
特别符号 &#?; (其中 ? 代表 ISO 8859-1 的编码) 7 ^' W/ ]* v% t  j4 e9 U
< < > > & & " "
/ O$ G5 G; r1 `0 E  X注册商标TM ? 4 ^" d+ w' p: a( L) P. t, l
N1.0+ 注册商标TM ? % j! |. @; G9 _' a0 ?9 G+ y
著作权符号 ?
2 |- m' D5 X1 cN1.0+ 著作权符号 ?
( l& S: H! [6 D3 R* T
( k' c3 I4 X+ a6 J6 f5.表单 (通常需要与CGI程式配合) 6 u  g- B1 V9 r, L# @! a

& C9 Y! _7 ^8 q定义表单 <FORM ACTION="URL" METHOD=GET|POST></FORM> & n; P6 G* h: {" P
N2.0 上传档案 <FORM ENCTYPE="multipart/form-data></FORM>
1 p5 v0 Y9 B3 n输入栏位 <INPUT TYPE="TEXT|PASSWORD|CHECKBOX|RADIO|IMAGE|HIDDEN|SUBMIT|RESET">
, C6 g$ V6 Q& S1 g' }2 A栏位名称 <INPUT NAME="***"> : B- {. z7 J" L1 g
栏位内定值 <INPUT value="***"> , v4 m# V: z' }8 b3 h# q5 j, J8 Z$ n
已选定 <INPUT CHECKED> (适用於checkboxes与 radio boxes)
5 t# J% t# \0 o. \# @( R4 a- T栏位宽度 <INPUT SIZE=?> (以字元数为单位)
' @5 U1 F; s7 l/ L# n) s1 @最长字数 <INPUT MAXLENGTH=?> (以字元数为单位) , f' z4 l, k9 N$ t/ F5 c7 d& d
下拉式选单 <SELECT></SELECT> * |& S4 s8 R8 ?: J( }: E$ |
下拉式选单名称 <SELECT NAME="***"></SELECT>
# g- W! _: `+ e. A选单项目数量 <SELECT SIZE=?></SELECT> ' F+ r. e  v& z( a
多选式选单 <SELECT MULTIPLE> (多选)
4 V, d' W  T8 f8 {选项 <OPTION>
2 f& z1 B" r/ }: W内定选项 <OPTION SELECTED> 3 @) Q, P- s# P2 N5 Z
文字输入区 <TEXTAREA ROWS=? COLS=?></TEXTAREA>
7 d+ B7 F; k$ T3 I5 J输入区名称 <TEXTAREA NAME="***"></TEXTAREA> 9 y1 Z$ z8 y# W6 u5 t
N2.0 输入区换行方式 <TEXTAREA WRAP=OFF|VIRTUAL|PHYSICAL></TEXTAREA>
3 }3 N2 x# {3 e4 f, N. p, O  ^- J4 h( a* A
6.表格
" [7 B7 H) ?) q, W! [
& H  \3 k1 y- }3.0 定义表格 <TABLE></TABLE>
5 }' _- b$ a: V# ~3.0 表格框线 <TABLE BORDER></TABLE> (有或没有) - G) z/ ]. K2 x) w! r7 g
N1.1 表格框线 <TABLE BORDER=?></TABLE>(可以设定数值) 9 h/ }: n# J, t  E3 n
N1.1 储存格左右留白 <TABLE CELLSPACING=?> 9 u6 O  i/ ~' T5 j3 q/ u5 L
N1.1 储存格上下留白 <TABLE CELLPADDING=?>
  w7 P2 `& l5 o4 M& d" E, |; pN1.1 表格宽度 <TABLE WIDTH=?> (以pixels为单位)
0 {0 ^& Y  b: E2 o9 mN1.1 宽度比率 <TABLE WIDTH=%> (页宽为100%)
2 o/ l  t% I/ u1 P1 F- Q- d( T3.0 表格列 <TR></TR> ( }0 @6 Y( B  E- r; e
3.0 表格列内容看齐 <TR ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM>
4 N( @1 o7 X& D7 J$ D3.0 储存格 <TD></TD> (须与列并用) + y( p3 u" Z3 J
3.0 储存格内容看齐 <TD ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM>
0 N" R3 P( N- B0 D- G6 I0 M) Y3.0 不换行 <TD NOWRAP> # H( O. V" ^2 t( y
N3.0 储存格背景颜色 <TD BGCOLOR=#$$$$$$> , v6 L6 V4 f5 d0 f) I
3.0 储存格横向连接 <TD COLSPAN=?>
' R+ l! k) q% s* Y9 {3.0 储存格纵向连接 <TD ROWSPAN=?> 9 `1 t6 `/ q4 a. G$ \  [6 d
N1.1 储存格宽度 <TD WIDTH=?> (以pixels为单位)
/ s. ^8 I1 m, C5 u$ ON1.1 储存格宽度比率 <TD WIDTH=%> (页宽为100%)
# u) B' T, w6 M  E3.0 表格标题 <TH></TH> (跟<TD>一样,不过会对中并加粗) 5 v' B9 K6 j7 h
3.0 表格标题对齐 <TH ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM>
+ a# A2 ?( u/ C8 x9 o& J  F3.0 表格标题不换行 <TH NOWRAP> 5 P1 a$ [9 H' H
3.0 表格标题占几栏 <TH COLSPAN=?>
6 l! ~: n7 B* w4 `! Q( Y7 f3.0 表格标题占几列 <TH ROWSPAN=?> ( x- Z# ?" f0 G, n- L
N1.1 表格标题宽度 <TH WIDTH=?> (以pixels为单位) % U( h% L! {+ s, f
N1.1 表格标题比率宽度<TH WIDTH=%> (页宽为100%)
' e& d2 Z% ]* |. M  y9 j5 O% M3.0 表格抬头 <CAPTION></CAPTION>
+ C! y* y& h4 H% C+ v3.0 表格抬头看齐 <CAPTION ALIGN=TOP|BOTTOM>(在表格之上/之下)
( u3 ~7 `& a5 U  ~/ P视框 (定义与控制萤幕上的特定区域)
8 N# G0 c0 \7 s4 T8 }# w: r3 BN2.0 视框格式总定义 <FRAMESET></FRAMESET> (取代<BODY>) ' m6 a4 w  J; F2 d
N2.0 视框行长度分配 <FRAMESET ROWS=,,,></FRAMESET>(pixels 或 %)
  R( _3 N0 U/ k' {& JN2.0 视框行长度分配 <FRAMESET ROWS=*></FRAMESET> (* = 相对大小) : Y. j- c6 t/ n1 G2 A* y6 s* U
N2.0 视框栏宽度分配 <FRAMESET COLS=,,,></FRAMESET>(pixels 或 %) 6 B9 @( h8 ?3 {( }( C( m/ @* g5 W
N2.0 视框栏宽度分配 <FRAMESET COLS=*></FRAMESET> (* =相对大小)
" ?5 N6 L4 _5 d; X( CN2.0 定义个别视框 <FRAME> (定义个别视框)
: k( L: Z/ @8 q- [N2.0 个别视框内容 <FRAME src="/URL"> 1 j5 _: l: W' C; J8 H
N2.0 个别视框名称 <FRAME NAME="***"|_blank|_self|_parent|_top> / \5 }$ g8 y& t3 U3 e& J
N2.0 边缘宽度 <FRAME MARGINWIDTH=?> (「左」与「右」边界)
# V- b0 J* O1 o% V3 BN2.0 边缘高度 <FRAME MARGINHEIGHT=?> (「天顶」与「地底」边界) - r+ A  n7 z) H. a) \  D0 _
N2.0 卷动条 <FRAME SCROLLING="YES|NO|AUTO">
. E$ ~( {' T2 }9 R! I) h5 tN2.0 不可改变大小 <FRAME NORESIZE> 4 y6 X6 f( P  A$ a
N2.0 无视框时的内容 <NOFRAMES></NOFRAMES>(如果浏览器不提供视框功能的话)
怨去吹箫,狂来说剑,两样销魂味。
好东西啊,不错不错,存上先,用的时候复制粘贴
返回列表