返回列表 回复 发帖

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

1.结构性定义 " ?8 P) }6 c* {) T7 n, g9 O0 M

- s8 V! N( O) y& w. x文件类型 <HTML></HTML> (放在档案的开头与结尾)
0 A: Q2 L6 O3 K3 e3 Q: m4 w文件主题 <TITLE></TITLE> (必须放在「文头」区块内) ! S& c/ ^4 b/ `7 A0 @
文头 <HEAD></HEAD> (描述性资料,像是「主题」) 7 Q: ]# D6 k9 D3 f2 c
文体 <BODY></BODY> (文件本体)
! p$ a* D+ a4 u1 J0 I8 n(由浏览器控制的显示风格)
, l1 x9 O8 g+ A+ D! Y! U0 o标题 <H?></H?> (从1到6,有六层选择) 0 v/ v1 m5 a* j$ k, U. w; W
标题的对齐 <H? ALIGN=LEFT|CENTER|RIGHT></H?>
5 z1 W+ Q  g5 H区分 <DIV></DIV>
/ Y; s/ A0 ^; d区分的对齐 <DIV ALIGN=LEFT|RIGHT|CENTER|JUSTIFY></DIV> " K( p( ]# a" |) b7 B8 F
引文区块 <BLOCKQUOTE></BLOCKQUOTE> (通常会内缩) 0 G* X+ P- @$ h/ x) Y$ b4 n. l
强调 <EM></EM> (通常会以斜体显示) / i0 A% ^$ ~9 o4 v8 c. N1 z
特别强调 <STRONG></STRONG> (通常会以加粗显示)
5 X3 N( U* W& F: ^引文 <CITE></CITE> (通常会以斜体显示)
& i, _$ B' u3 a  B码 <CODE></CODE> (显示原始码之用) ( M0 x2 v/ u/ ~" q( L4 j) W9 N
样本 <SAMP></SAMP> 3 y  q- J  ^5 Y5 u
键盘输入 <KBD></KBD> 1 f& A. R2 K4 }$ K" y% v
变数 <VAR></VAR>
. L$ s$ Z0 V2 ?( x定义 <DFN></DFN> (有些浏览器不提供)
* ]+ C; h3 t( s- d地址 <ADDRESS></ADDRESS> ( P1 G( a- D$ K1 a
大字 <BIG></BIG>
9 e1 ?* V# k- T5 S! ^小字 <SMALL></SMALL> 2 B4 n' z3 M; J' t; z$ A
与外观相关的标签(作者自订的表现方式) / f, {* W4 c7 e" Q; E( n7 i
加粗 <B></B> " }2 h" `  c. `9 u
斜体 <I></I> 8 r3 G2 v! _/ y% Z4 \4 y3 N- M
底线 <U></U> (尚有些浏览器不提供)
/ V: {6 s/ d. P3 ?删除线 <S></S> (尚有些浏览器不提供)
0 D& U+ N" _. Y) _0 ?下标 <SUB></SUB> 0 F/ ?' }' [# q; m( ~- N3 F0 a
上标 <SUP></SUP> . V% y8 }6 b  |, N. Y& l: W- O
打字机体 <TT></TT> (用单空格字型显示)
" A+ \, U  Z& A/ U5 d1 O预定格式 <PRE></PRE> (保留文件中空格的大小)
$ N1 y. T% t6 e; h- K. f预定格式的宽度 <PRE WIDTH=?></PRE>(以字元计算) - [$ Z& g* ^, l. o
向中看齐 <CENTER></CENTER> (文字与图片都可以) * a  Z  u5 L9 z
闪耀 <BLINK></BLINK> (有史以来最被嘲弄的标签)
4 k0 L: _* ^* U, w  I字体大小 <FONT SIZE=?></FONT>(从1到7) 0 v3 R# q3 }# k3 [6 Q/ i
改变字体大小 <FONT SIZE=+|-?></FONT> . w: B& d/ a. G
基本字体大小 <BASEFONT SIZE=?> (从1到7; 内定为3) 7 \( o' w7 q2 ?2 {2 p7 X
字体颜色 <FONT COLOR="#$$$$$$"></FONT>
% v4 F7 J4 f6 E2 r4 f" d  |& G5 q: A9 V! t/ |
2.连结与图形 9 ^; h* O& _' p0 v1 O0 Q* ~$ }

  A( Y7 K  A3 P4 J连结 <A href="/URL"></A> 8 v' Z6 J  {6 M
连结到锚点 <A HREF="URL#***"></A>(如果锚点在另一个档案) * t  o8 N) ]9 A3 W# |/ x+ H1 A
<A HREF="#***"></A> (如果锚点目前的档案) ) @2 b, T5 [% T1 w) i1 W9 s
连结到目的视框 <A href="/URL" TARGET="***"></A> 1 `& j; V' ]7 ?/ \9 e; n/ c
设定锚点 <A NAME="***"></A> " x/ }$ A' \# N, s( r6 f2 s
图形 <IMG src="/URL">
7 U( d2 I+ Z) q# C- p8 m* X图形看齐方式 <IMG src="/URL" ALIGN=TOP|BOTTOM|MIDDLE>
: {7 T+ r" \/ K) r$ {6 z图形看齐方式 <IMG src="/URL" ' r7 Q. K) d( N2 D
ALIGN=LEFT|RIGHT|TEXTTOP|ABSMIDDLE|BASELINE|ABSBOTTOM> ! l* R- H2 R& u
取代文字 <IMG src="/URL" ALT="***"> (如果没有办法显示图形则显示此文字) 5 e8 t$ F/ J' g! h: q3 V1 s
点选图 <IMG src="/URL" ISMAP> (需要CGI程式)   p' O6 R7 k( m- `. R
N2.0 点选图 <IMG src="/URL" USEMAP="URL">
. w8 i5 [- D* y7 f$ ]7 }8 ^2 P5 ?N2.0 地图 <MAP NAME="***"></MAP>(描述地图) ) _  d# u  @4 s: K7 Q" P! k
N2.0 段落 <AREA SHAPE="RECT" COORDS=",,," href="/URL"|NOHREF>
" i$ e$ I5 d% h0 t5 U0 d3.0 大小 <IMG src="/URL" WIDTH="?" HEIGHT="?">(以pixels为单位) N1.0 图形边缘 <IMG src="/URL" BORDER=?> (以pixels为单位)
' w+ R. x# z6 L& M# tN1.0 图形边缘空间 <IMG src="/URL" HSPACE=? VSPACE=?> (以pixels为单位)
" B7 m/ X8 B4 DN1.0 低解析度图形 <IMG src="/URL" LOWsrc="/URL">
* ]$ o& z8 t: ]  {0 p. ]N1.1 用户端拉 <META HTTP-EQUIV="Refresh" CONTENT="?; URL=URL">(使用端自动更新 ) & v+ |- e* c9 e5 g& Z9 h3 |) n
N2.0 内嵌物件 <EMBED src="/URL"> (将物件插入页面) 9 J# {) E* W, w, N( j  H$ H
N2.0 内嵌物件大小 <EMBED src="/URL" WIDTH="?" HEIGHT="?"> 5 Y  f1 d7 T; O! E( `. y
' p! R* r& D2 e' M/ Q+ W
3.分隔3 v6 z) _. ?3 v$ f) M/ f

# q* u+ W: o- v* q- k段落 <P> (通常是两个return)
6 `) D$ h( y! P0 h0 n9 Z6 H- K3.0 段落 <P></P> (新定义成容器型标签)
6 H; i- N& y1 g5 Z+ l8 [3 e3.0 文字看齐方式 <P ALIGN=LEFT|CENTER|RIGHT></P>
/ ~3 ?' o7 ^! f; r4 i4 x换行 <BR> (一个return) $ v" [2 j5 L+ q7 X
N1.0 文字部份看齐方式<BR CLEAR=LEFT|RIGHT|ALL>(与图形合用时)
7 _; |4 x1 F* J2 ^横线 <HR> 0 T9 h4 t/ z4 x* a9 o& Q5 @* C2 f6 H) x
N1.0 横线对齐 <HR ALIGN=LEFT|RIGHT|CENTER>
" r/ L* S3 B. i+ W# M' D" O. bN1.0 横线厚度 <HR SIZE=?> (以pixels为单位)
: q1 Y2 K5 w# I/ x* }8 T. x6 x* bN1.0 横线宽度 <HR WIDTH=?> (以pixels为单位)
; K5 y5 y* a, F( L! }% vN1.0 横线比率宽度 <HR WIDTH=%> (以页宽为100%) 7 H( ^% g* w+ e( n2 e: z2 M+ j9 _
N1.0 实线 <HR NOSHADE> (没有立体效果)
; R9 w1 _. ]9 H: j6 ^3 UN1.0 不可换行 <NOBR></NOBR> (不换行) - S8 t5 f; X$ Z" s9 u
N1.0 可换行处 <WBR> (如果需要,可在此断行) 5 A3 a( B! @7 m
列举 (可以巢状列举) + a+ x' a( @8 k( [" [
无次序式列举 <UL><LI></UL> (<LI> 放在每一项前)
/ U, E$ u# T% CN1.0 公布式列举 <UL TYPE=DISC|CIRCLE|SQUARE>(定义全部的列举项) : o) s7 X5 G3 u6 f/ o- R
<LI TYPE=DISC|CIRCLE|SQUARE>(定义这个及其後的列举项) % ^& @: X" S+ k/ E
有次序式列举 <OL><LI></OL> (<LI> 放在每一项前) # n" b, E2 n) X5 F4 r8 B7 Z
N1.0 数标型态 <OL TYPE=A|a|I|i|1> (定义全部的列举项) 9 r' Y8 p4 E7 B& D/ c( `
<LI TYPE=A|a|I|i|1> (定义这个及其後的列举项)
; L: O% Y) A% aN1.0 起始数字 <OL value=?> (定义全部的列举项) - o; u7 T" c8 g" E3 i$ T
<LI value=?> (定义这个及其後的列举项) 8 L" a1 P6 E0 {- I
定义式列举 <DL><DT><DD></DL>(<DT>项目, <DD>定义)
9 C3 ~$ O: A3 T% G3 T表单式列举 <MENU><LI></MENU>(<LI> 放在每一项前) ' h6 T$ b. ?# `& L
目录式列举 <DIR><LI></DIR> (<LI> 放在每一项前) ( D$ I  W2 R( c0 D; t8 u6 L
背景与颜色
& ?! X9 W0 {0 n& o1 f4 a3.0 重复排列的背景 <BODY background="/URL">
& c9 u5 x1 B# I6 n- b+ uN1.1+ 背景颜色 <BODY BGCOLOR="#$$$$$$"> (依序为红、绿、蓝)
) |+ m7 U8 L1 B- F( L( b* b; {N1.1+ 文字颜色 <BODY TEXT="#$$$$$$"> % I, K" a) k2 U6 y
N1.1+ 连结颜色 <BODY LINK="#$$$$$$"> : W% L! i. X) L. T$ X5 j
N1.1+ 看过的连结 <BODY VLINK="#$$$$$$"> 7 |7 ~0 e' I" Q9 {* V0 |
N1.1 使用中的连结 <BODY ALINK="#$$$$$$">
# s6 F- w5 W' i& K) N+ A5 w; O- j& |: N
4.特殊字元(以下标签需用小写) 4 h0 S* R0 k0 |! F- x7 P# E, N
+ l$ P0 q/ Q7 n
特别符号 &#?; (其中 ? 代表 ISO 8859-1 的编码) - O7 N: ^% e8 _5 d! l. B
< < > > & & " "
# g6 Q, d  I9 ~/ n$ \4 E7 j1 ?注册商标TM ? ( I* s. {) X5 H1 y
N1.0+ 注册商标TM ? 1 w$ j) e3 P4 h7 U  S# y% `  w
著作权符号 ?
+ b0 U5 M/ c9 v9 \+ f/ vN1.0+ 著作权符号 ?
( [1 m; e3 [6 _/ n4 j. ?
0 @' M' D& E  v$ `# Q3 b1 q: z1 X5 |5.表单 (通常需要与CGI程式配合) & F' X0 B) c. Z! b. a% W3 u$ _

& o( L1 N" I0 A9 p! B, y定义表单 <FORM ACTION="URL" METHOD=GET|POST></FORM> 0 c7 c+ c5 Y4 X% x
N2.0 上传档案 <FORM ENCTYPE="multipart/form-data></FORM> , |& @) x- o9 E1 K6 a+ T+ A1 [
输入栏位 <INPUT TYPE="TEXT|PASSWORD|CHECKBOX|RADIO|IMAGE|HIDDEN|SUBMIT|RESET">
' Q, }/ \# k" P" d) O" _% y8 W栏位名称 <INPUT NAME="***"> % j( A4 y9 H/ J
栏位内定值 <INPUT value="***"> 1 H- G7 ~6 z, i/ H. u
已选定 <INPUT CHECKED> (适用於checkboxes与 radio boxes) & {! G0 B2 T" n2 g
栏位宽度 <INPUT SIZE=?> (以字元数为单位) " ], d3 G& ]5 m7 G- T
最长字数 <INPUT MAXLENGTH=?> (以字元数为单位)
+ a7 J8 Y# O7 t下拉式选单 <SELECT></SELECT>
8 I  k* B2 o/ a下拉式选单名称 <SELECT NAME="***"></SELECT>
4 J1 c* i/ B6 S2 q2 Z- _选单项目数量 <SELECT SIZE=?></SELECT> , N* X1 }" N) r) O/ z* P
多选式选单 <SELECT MULTIPLE> (多选)
: c5 M8 n( ^1 K' [; [# S选项 <OPTION> " S, k( y/ A" C: y8 f
内定选项 <OPTION SELECTED> / z# t& d9 R# M7 t- H2 _2 y# Q
文字输入区 <TEXTAREA ROWS=? COLS=?></TEXTAREA> : f$ n$ K3 Z0 t$ R7 d& ?" w. i
输入区名称 <TEXTAREA NAME="***"></TEXTAREA>
6 A+ Y" l$ P2 s5 }N2.0 输入区换行方式 <TEXTAREA WRAP=OFF|VIRTUAL|PHYSICAL></TEXTAREA>
6 S0 Z5 X* w2 n" i+ i& |) `3 i0 G% f' M/ _% s( V5 g% I
6.表格
1 n( U; T: Z: K0 `9 D& A
1 l& g( @* l) A3 w* m5 |/ S3 ]9 N/ e3.0 定义表格 <TABLE></TABLE>
. i8 V) R* x" K" ^5 T+ P6 V3.0 表格框线 <TABLE BORDER></TABLE> (有或没有) - x, {( T1 R" J) g" {5 b
N1.1 表格框线 <TABLE BORDER=?></TABLE>(可以设定数值)
, k) {2 |4 g. h' [# n4 t/ l0 GN1.1 储存格左右留白 <TABLE CELLSPACING=?>
. y& q6 {- B; ]. h8 `" K- GN1.1 储存格上下留白 <TABLE CELLPADDING=?> " T3 m  G9 q- B+ C6 c
N1.1 表格宽度 <TABLE WIDTH=?> (以pixels为单位) . C4 U. Z4 f3 C9 R9 H( j- C' R$ d
N1.1 宽度比率 <TABLE WIDTH=%> (页宽为100%) % s+ B3 d" }9 |5 d( r) J
3.0 表格列 <TR></TR> 5 D( J! l0 p4 v+ W& k
3.0 表格列内容看齐 <TR ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM>
( f- v: O! D5 _' q5 g8 g/ }3.0 储存格 <TD></TD> (须与列并用) 3 r4 E" M, L3 K1 S6 g
3.0 储存格内容看齐 <TD ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM>
) \4 ]( s/ O. }3 ^3.0 不换行 <TD NOWRAP>
; L- a; K/ r( Q7 ^/ |6 b, Z& nN3.0 储存格背景颜色 <TD BGCOLOR=#$$$$$$> + @  r4 J9 ^- w% R
3.0 储存格横向连接 <TD COLSPAN=?>
* p& d+ M/ o- X/ g5 R& J/ o3.0 储存格纵向连接 <TD ROWSPAN=?> 1 X% c6 E2 x' I+ b* q$ w3 M7 |
N1.1 储存格宽度 <TD WIDTH=?> (以pixels为单位)
  d6 `: ]. J, u& a$ e2 u  EN1.1 储存格宽度比率 <TD WIDTH=%> (页宽为100%) ' E0 }. w) M3 t, r
3.0 表格标题 <TH></TH> (跟<TD>一样,不过会对中并加粗)
* K2 Q& p6 Q* K" I) ^3.0 表格标题对齐 <TH ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM> / I5 N" w6 N# H) c( ?- r5 M
3.0 表格标题不换行 <TH NOWRAP> - B. H" ?+ `5 y; b
3.0 表格标题占几栏 <TH COLSPAN=?>
) y" o* B/ V4 ]3.0 表格标题占几列 <TH ROWSPAN=?> 5 F% A" }# a3 W" f* u! ?8 o& w
N1.1 表格标题宽度 <TH WIDTH=?> (以pixels为单位)
" j) f& j1 s4 [2 v7 X! T9 p6 ZN1.1 表格标题比率宽度<TH WIDTH=%> (页宽为100%) 4 W3 P3 N# I6 _% f) h  ?1 Y1 a5 A
3.0 表格抬头 <CAPTION></CAPTION> & ^/ a" \: w1 e! `) G$ A* F3 q
3.0 表格抬头看齐 <CAPTION ALIGN=TOP|BOTTOM>(在表格之上/之下) 4 }$ h: W2 Z' r9 b
视框 (定义与控制萤幕上的特定区域)
! [+ ^; J. y: g) pN2.0 视框格式总定义 <FRAMESET></FRAMESET> (取代<BODY>) " V( q7 z/ C2 T0 H2 R3 H
N2.0 视框行长度分配 <FRAMESET ROWS=,,,></FRAMESET>(pixels 或 %) 0 }, H# o0 _9 ^
N2.0 视框行长度分配 <FRAMESET ROWS=*></FRAMESET> (* = 相对大小)
( i& K/ p3 ?& _' f* K5 B( WN2.0 视框栏宽度分配 <FRAMESET COLS=,,,></FRAMESET>(pixels 或 %)
* s/ ~# i6 _2 h# z% zN2.0 视框栏宽度分配 <FRAMESET COLS=*></FRAMESET> (* =相对大小) * P: c! a8 \8 L7 d+ W
N2.0 定义个别视框 <FRAME> (定义个别视框)
4 s: b% x6 E1 l) d9 d  RN2.0 个别视框内容 <FRAME src="/URL"> 8 C! M8 D. D6 v1 c+ z
N2.0 个别视框名称 <FRAME NAME="***"|_blank|_self|_parent|_top> 8 x3 l9 d' F0 E5 B1 j
N2.0 边缘宽度 <FRAME MARGINWIDTH=?> (「左」与「右」边界) 4 C  ^( \9 Y4 `% K
N2.0 边缘高度 <FRAME MARGINHEIGHT=?> (「天顶」与「地底」边界) 8 f" y  j: ]9 Y
N2.0 卷动条 <FRAME SCROLLING="YES|NO|AUTO"> * e4 h6 i* ]& a, D% y' F
N2.0 不可改变大小 <FRAME NORESIZE> , w/ b0 j' s6 N# }  A( A3 C
N2.0 无视框时的内容 <NOFRAMES></NOFRAMES>(如果浏览器不提供视框功能的话)
怨去吹箫,狂来说剑,两样销魂味。
好东西啊,不错不错,存上先,用的时候复制粘贴
返回列表