返回列表 回复 发帖

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

1.结构性定义 8 |* U& o6 D$ F9 B6 T+ Y
3 j6 ?; `" g. J% c! `/ K
文件类型 <HTML></HTML> (放在档案的开头与结尾) 4 r4 w7 T9 K" h+ ~+ q8 F
文件主题 <TITLE></TITLE> (必须放在「文头」区块内)
/ }: K& i& z0 v" A文头 <HEAD></HEAD> (描述性资料,像是「主题」) - K& C$ K  W6 s% r2 `1 i2 G0 l
文体 <BODY></BODY> (文件本体) ' z, x3 h  \7 N
(由浏览器控制的显示风格) , X8 F2 `! C7 [/ i2 u* {
标题 <H?></H?> (从1到6,有六层选择)   O! N% k# K6 y$ U' U
标题的对齐 <H? ALIGN=LEFT|CENTER|RIGHT></H?>
! h* l. E4 {9 Q$ o+ u7 r* S2 L5 u区分 <DIV></DIV>
: B7 B* D0 b- h4 W) P" k1 c& v; N8 ^区分的对齐 <DIV ALIGN=LEFT|RIGHT|CENTER|JUSTIFY></DIV> : k  H" o' Q8 d
引文区块 <BLOCKQUOTE></BLOCKQUOTE> (通常会内缩)
# x* e- \( p; a9 b0 N$ ~1 ^. L% O强调 <EM></EM> (通常会以斜体显示)
" N0 l% @2 o- _+ q3 k特别强调 <STRONG></STRONG> (通常会以加粗显示) 5 }. m) P# m+ L
引文 <CITE></CITE> (通常会以斜体显示) ; w2 Y2 l( ]8 Z- p. K
码 <CODE></CODE> (显示原始码之用)
5 _1 i: B/ d3 H样本 <SAMP></SAMP>
1 ?4 Z( I8 }7 Y5 O6 B4 w键盘输入 <KBD></KBD> 2 N5 G) ^( `1 D# D7 N+ n' [/ A5 U6 @
变数 <VAR></VAR>
. K* e. c/ S  Q& _7 E定义 <DFN></DFN> (有些浏览器不提供)
8 C+ R1 }% K/ F2 c% U6 I; E地址 <ADDRESS></ADDRESS> : y7 V$ Z9 k( }
大字 <BIG></BIG> ( F. J* X/ B0 n, f
小字 <SMALL></SMALL> ! L+ Q! Q6 b" S7 C! T- ?8 H  R
与外观相关的标签(作者自订的表现方式)
" v- g* H% _( d8 c2 i加粗 <B></B>
* E$ K- B9 d0 T% X; Q斜体 <I></I>
) B* b5 S* x; W  n- J- `底线 <U></U> (尚有些浏览器不提供) " {; r5 ]8 l) ^- d2 c, L6 l
删除线 <S></S> (尚有些浏览器不提供) 3 P: A+ U( ^) C) }
下标 <SUB></SUB>
+ ]$ R. S7 |* ^8 K上标 <SUP></SUP>
1 i5 ~& X: p7 w1 M) K, _$ N打字机体 <TT></TT> (用单空格字型显示)
) D. ]8 u2 N  `' U! F预定格式 <PRE></PRE> (保留文件中空格的大小)
8 ?( u6 E$ a8 Z预定格式的宽度 <PRE WIDTH=?></PRE>(以字元计算) ) @4 @% P  d" P1 f8 \  p0 M; l
向中看齐 <CENTER></CENTER> (文字与图片都可以) ( T  A4 p, j$ `- d* S1 F: u! ~( l3 B! D+ ]
闪耀 <BLINK></BLINK> (有史以来最被嘲弄的标签)
$ o$ A$ H5 ]9 ^5 A' s字体大小 <FONT SIZE=?></FONT>(从1到7)
5 ~6 \& s8 h6 m( X: b' [& P1 J改变字体大小 <FONT SIZE=+|-?></FONT>
# O9 l9 n, d/ B1 k0 E' ]基本字体大小 <BASEFONT SIZE=?> (从1到7; 内定为3)   l( {- v9 Y4 H) ?: e
字体颜色 <FONT COLOR="#$$$$$$"></FONT>
; M3 |4 K% ?8 d9 i: {. k$ ^- n: A) ?4 \) `; P* A
2.连结与图形 ) o' x4 M2 V  y/ U; j

  Y( g' J: ~, c7 a( W连结 <A href="/URL"></A> , B1 _' {0 U4 k/ A; N
连结到锚点 <A HREF="URL#***"></A>(如果锚点在另一个档案)
6 ]$ d: r# ~% M& S7 L0 |9 P<A HREF="#***"></A> (如果锚点目前的档案)
/ ?# |1 u- T9 z$ [, |连结到目的视框 <A href="/URL" TARGET="***"></A>
) W4 Y9 g% A) q- D$ W" z) N3 x设定锚点 <A NAME="***"></A>
  ?; A/ M' \* _% n- ^图形 <IMG src="/URL"> # O4 `: {; _! k$ J( M8 {
图形看齐方式 <IMG src="/URL" ALIGN=TOP|BOTTOM|MIDDLE> " W/ H3 E' V% r. m# ?
图形看齐方式 <IMG src="/URL" / V, n2 Q$ R) ?/ ?2 ^
ALIGN=LEFT|RIGHT|TEXTTOP|ABSMIDDLE|BASELINE|ABSBOTTOM>
7 r' Z5 t" d# `& _1 |0 R2 p取代文字 <IMG src="/URL" ALT="***"> (如果没有办法显示图形则显示此文字) " S  [* W) N& T' B9 Q7 s* c: ~" C
点选图 <IMG src="/URL" ISMAP> (需要CGI程式)
3 W' j4 b! b$ i4 BN2.0 点选图 <IMG src="/URL" USEMAP="URL">
( N1 O& A7 O) d) @) H% ~  eN2.0 地图 <MAP NAME="***"></MAP>(描述地图) : ]6 m2 F3 R7 \' t# `
N2.0 段落 <AREA SHAPE="RECT" COORDS=",,," href="/URL"|NOHREF>
' x$ |4 i  e& o3.0 大小 <IMG src="/URL" WIDTH="?" HEIGHT="?">(以pixels为单位) N1.0 图形边缘 <IMG src="/URL" BORDER=?> (以pixels为单位)
: z1 g6 K! T- [' YN1.0 图形边缘空间 <IMG src="/URL" HSPACE=? VSPACE=?> (以pixels为单位) 4 @& Q  W7 ^( d2 R+ y: X. E* Y
N1.0 低解析度图形 <IMG src="/URL" LOWsrc="/URL"> 6 B8 m/ f9 _( G' }4 F/ t# i! t1 ^' ^
N1.1 用户端拉 <META HTTP-EQUIV="Refresh" CONTENT="?; URL=URL">(使用端自动更新 ) ) l0 `+ \, H# l
N2.0 内嵌物件 <EMBED src="/URL"> (将物件插入页面) ' e& R2 B* g6 X; i5 {! c
N2.0 内嵌物件大小 <EMBED src="/URL" WIDTH="?" HEIGHT="?">
# o& ?5 B! O2 T5 h2 Y8 R8 Z* n
! ?- C8 f8 w, b; ]& {3 E% U: [+ A4 ^- g3.分隔* g9 o6 P) V. M% [/ V( Z
& T4 o, V* o, Y% a
段落 <P> (通常是两个return)
. y; d( i+ U% H' X( ^4 `3.0 段落 <P></P> (新定义成容器型标签) 7 I. g, q* M, }% z2 S. m" B
3.0 文字看齐方式 <P ALIGN=LEFT|CENTER|RIGHT></P> , L3 _8 P5 u7 H" q9 U' c5 p2 B* T
换行 <BR> (一个return) 7 s+ v+ g  C$ A: H8 E( c
N1.0 文字部份看齐方式<BR CLEAR=LEFT|RIGHT|ALL>(与图形合用时) + G1 ^3 R3 w% s6 u1 c( Z  G$ k
横线 <HR>
6 Z* v6 X  C/ g) R+ T* CN1.0 横线对齐 <HR ALIGN=LEFT|RIGHT|CENTER>
1 x0 o- i9 r- N3 @! o6 Y& Q7 O9 d+ BN1.0 横线厚度 <HR SIZE=?> (以pixels为单位) + x* z6 ?; N/ a4 a# U
N1.0 横线宽度 <HR WIDTH=?> (以pixels为单位) & X  G, P$ e6 M6 B0 O
N1.0 横线比率宽度 <HR WIDTH=%> (以页宽为100%)
/ s( L$ P0 Y" w( I* g3 O7 H$ }0 \N1.0 实线 <HR NOSHADE> (没有立体效果) 8 b" [5 A; z+ i8 j4 K, R
N1.0 不可换行 <NOBR></NOBR> (不换行) * P1 K( k; z0 @( s: J( `; I
N1.0 可换行处 <WBR> (如果需要,可在此断行) * n7 \( x' a2 J5 P4 F- p$ H: {
列举 (可以巢状列举)
1 h# X, e7 c! \* x无次序式列举 <UL><LI></UL> (<LI> 放在每一项前)
: ]( X  G6 A7 `, X/ k. A) Z; eN1.0 公布式列举 <UL TYPE=DISC|CIRCLE|SQUARE>(定义全部的列举项)
# _% n4 h# p7 r& I6 `<LI TYPE=DISC|CIRCLE|SQUARE>(定义这个及其後的列举项) ! w& R  Y! {' x' o' s9 N5 O  v" W
有次序式列举 <OL><LI></OL> (<LI> 放在每一项前)
$ N5 _; M& U& I5 s+ cN1.0 数标型态 <OL TYPE=A|a|I|i|1> (定义全部的列举项)
8 s5 C% {' `$ q: O0 R<LI TYPE=A|a|I|i|1> (定义这个及其後的列举项) 7 J7 c+ F1 o7 V# M( j
N1.0 起始数字 <OL value=?> (定义全部的列举项)
* w' @* q/ }% P9 {3 `) v<LI value=?> (定义这个及其後的列举项) ) o/ X& u9 R) l' R
定义式列举 <DL><DT><DD></DL>(<DT>项目, <DD>定义)
# Y/ L& [5 {( Q) J" \- q表单式列举 <MENU><LI></MENU>(<LI> 放在每一项前)
8 J3 W) m, a  w5 Z7 R# s2 F目录式列举 <DIR><LI></DIR> (<LI> 放在每一项前)
& m/ B% g4 z7 j6 M1 M背景与颜色 # i7 B! V( x3 k+ I! F1 [* t& o
3.0 重复排列的背景 <BODY background="/URL">
$ M0 S) G! Z# h6 }) ]. ^: h1 [N1.1+ 背景颜色 <BODY BGCOLOR="#$$$$$$"> (依序为红、绿、蓝)
9 L) N3 F: t$ U( |8 b' yN1.1+ 文字颜色 <BODY TEXT="#$$$$$$">
: s, `; c% u) ^' Q& e* PN1.1+ 连结颜色 <BODY LINK="#$$$$$$"> * G/ [  ?3 l- E) O; I7 K8 y
N1.1+ 看过的连结 <BODY VLINK="#$$$$$$">
8 \7 f* R* m( q+ sN1.1 使用中的连结 <BODY ALINK="#$$$$$$"> 2 Y+ [& [3 V+ ^, f, O4 l

# d  ]5 ?0 O- _# T; e; C3 z5 ^4.特殊字元(以下标签需用小写) - l5 M6 A3 x; B

( W4 c; t8 ^) A2 A1 H特别符号 &#?; (其中 ? 代表 ISO 8859-1 的编码) # ?$ t, B7 z& t% U
< < > > & & " "
! h/ W/ ~9 E. I' U/ ^6 n5 m注册商标TM ?
/ V1 O& S8 H+ E5 o* j  {: p. [# w' UN1.0+ 注册商标TM ? ; d% r$ e7 N; j& O9 x
著作权符号 ?
* v/ V  V" P& J% q$ u& q5 G' s8 lN1.0+ 著作权符号 ? + p3 d/ H1 A# ?" Q/ g

$ f, a. B+ u/ x% u1 [+ H1 x, B5.表单 (通常需要与CGI程式配合) - A& I5 m# W3 q! b) M
2 L" O' v  `0 W4 W
定义表单 <FORM ACTION="URL" METHOD=GET|POST></FORM> ' \: J( m" F' b. }
N2.0 上传档案 <FORM ENCTYPE="multipart/form-data></FORM>
+ X* W# X. B5 p" N- Z输入栏位 <INPUT TYPE="TEXT|PASSWORD|CHECKBOX|RADIO|IMAGE|HIDDEN|SUBMIT|RESET"> / e: [9 O6 U5 f" o/ H/ H
栏位名称 <INPUT NAME="***"> - z; l) e+ _6 A0 e1 q+ J- J
栏位内定值 <INPUT value="***">
* Q, \. m0 a/ j已选定 <INPUT CHECKED> (适用於checkboxes与 radio boxes) + d6 n0 B% M' ~5 h% N. e2 ?
栏位宽度 <INPUT SIZE=?> (以字元数为单位) 0 e8 m' B# [+ ^2 \. ^
最长字数 <INPUT MAXLENGTH=?> (以字元数为单位) 7 d6 w/ F" p$ D4 a2 B9 ]6 k
下拉式选单 <SELECT></SELECT> 5 ^& P* {5 @# t5 i$ @5 Q
下拉式选单名称 <SELECT NAME="***"></SELECT> ! d- h3 V3 z8 \9 S
选单项目数量 <SELECT SIZE=?></SELECT>
2 Y$ z1 [6 V1 x/ G多选式选单 <SELECT MULTIPLE> (多选) + v) ~0 T/ [5 W
选项 <OPTION>
: W3 b/ ~6 A$ \5 d* C0 S  ?内定选项 <OPTION SELECTED>
0 s/ D- ?3 j% p" l7 e+ I7 s) `3 }! \文字输入区 <TEXTAREA ROWS=? COLS=?></TEXTAREA>
0 i! f, C) N  k) j输入区名称 <TEXTAREA NAME="***"></TEXTAREA> - M2 R. }( j! P: f9 p/ P0 V
N2.0 输入区换行方式 <TEXTAREA WRAP=OFF|VIRTUAL|PHYSICAL></TEXTAREA>
% J  \  w0 S7 ^5 E1 P" d/ J
  p2 s2 u, B6 T0 v9 t" E6.表格
8 T* {# Q) L% v& q
  H* x  D1 K6 R2 ?1 `* ^3.0 定义表格 <TABLE></TABLE>
& d& y# w# E* |' |& A; {3.0 表格框线 <TABLE BORDER></TABLE> (有或没有)
+ J: ~9 E; `+ o) v1 WN1.1 表格框线 <TABLE BORDER=?></TABLE>(可以设定数值) 3 V+ d6 @7 L. @' [, j* N, U9 t
N1.1 储存格左右留白 <TABLE CELLSPACING=?>
+ \( R& d- v7 J7 T# S- mN1.1 储存格上下留白 <TABLE CELLPADDING=?>
. G( G! R! S; y9 ZN1.1 表格宽度 <TABLE WIDTH=?> (以pixels为单位)
0 B, v% P$ d& Y' L$ K3 UN1.1 宽度比率 <TABLE WIDTH=%> (页宽为100%)
" Q! ^5 j. n7 i% b$ h9 [* h" q3.0 表格列 <TR></TR> : q& R. ]; F; ]
3.0 表格列内容看齐 <TR ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM>
1 K5 F& T, m# C* x: H" R3.0 储存格 <TD></TD> (须与列并用)
/ h9 o2 r1 t; |# A3.0 储存格内容看齐 <TD ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM>
1 {7 t! H3 M3 {6 H' {3.0 不换行 <TD NOWRAP>
( x: F$ [* S0 S, L. QN3.0 储存格背景颜色 <TD BGCOLOR=#$$$$$$> ! }" P4 f+ I4 G* j5 e0 J
3.0 储存格横向连接 <TD COLSPAN=?> - c  T* k0 U  `8 Q( _
3.0 储存格纵向连接 <TD ROWSPAN=?>
: p/ n8 x9 {6 o  U5 g- s' Q4 iN1.1 储存格宽度 <TD WIDTH=?> (以pixels为单位)
5 T5 Y+ \9 X2 L3 P9 K( uN1.1 储存格宽度比率 <TD WIDTH=%> (页宽为100%) 2 E% _: i& A( |1 W) B
3.0 表格标题 <TH></TH> (跟<TD>一样,不过会对中并加粗)
) s+ s" G4 L3 n1 O8 A: E3.0 表格标题对齐 <TH ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM>
. F, S' ]' F( g" K6 S3.0 表格标题不换行 <TH NOWRAP> , n6 @) B/ @1 n3 @" ^' e2 [
3.0 表格标题占几栏 <TH COLSPAN=?> ( t# \4 N" p3 {! v% b% g. s  c& G: M
3.0 表格标题占几列 <TH ROWSPAN=?> ( S0 Y6 D0 D+ s6 c$ z- _
N1.1 表格标题宽度 <TH WIDTH=?> (以pixels为单位) + m0 `$ M! ?5 u! B" a7 N# j
N1.1 表格标题比率宽度<TH WIDTH=%> (页宽为100%)
: R  M) u) }! q! }6 J3.0 表格抬头 <CAPTION></CAPTION>
' l! p/ r; W& m- u( W% b; K3.0 表格抬头看齐 <CAPTION ALIGN=TOP|BOTTOM>(在表格之上/之下)
$ j& P1 N, I2 f0 _视框 (定义与控制萤幕上的特定区域)
9 X5 U8 J2 _7 N* d+ {+ i1 eN2.0 视框格式总定义 <FRAMESET></FRAMESET> (取代<BODY>) 0 x6 `  d8 E7 @2 S' K# v
N2.0 视框行长度分配 <FRAMESET ROWS=,,,></FRAMESET>(pixels 或 %) / j: T0 w5 W% K
N2.0 视框行长度分配 <FRAMESET ROWS=*></FRAMESET> (* = 相对大小) " h% m2 s0 M$ y% `$ g
N2.0 视框栏宽度分配 <FRAMESET COLS=,,,></FRAMESET>(pixels 或 %)
4 @! W4 ~* h, \: ]N2.0 视框栏宽度分配 <FRAMESET COLS=*></FRAMESET> (* =相对大小) 1 N. l7 S( B# p, b# X( _
N2.0 定义个别视框 <FRAME> (定义个别视框) + a( U0 S$ \/ B- z) q6 x# f) _
N2.0 个别视框内容 <FRAME src="/URL"> 1 L) t) L: i% Q! O9 n
N2.0 个别视框名称 <FRAME NAME="***"|_blank|_self|_parent|_top> ( t* R7 B: R" [- k+ x" A
N2.0 边缘宽度 <FRAME MARGINWIDTH=?> (「左」与「右」边界)
9 a" J2 G, W- n3 L5 ?3 r! IN2.0 边缘高度 <FRAME MARGINHEIGHT=?> (「天顶」与「地底」边界)
$ ?/ j, e2 w# wN2.0 卷动条 <FRAME SCROLLING="YES|NO|AUTO">
3 z- I4 y: u" b% E$ s; kN2.0 不可改变大小 <FRAME NORESIZE>
# o; R! X) y4 YN2.0 无视框时的内容 <NOFRAMES></NOFRAMES>(如果浏览器不提供视框功能的话)
怨去吹箫,狂来说剑,两样销魂味。
好东西啊,不错不错,存上先,用的时候复制粘贴
返回列表