来自:LJM舞 > 馆藏分类
配色: 字号:
HTML中的常用标签
2012-11-05 | 阅:  转:  |  分享 
  
这些都是HTML中的常用标签他们都有特定的定义

没有英文全名

HTML标签详解

结构

<html>

<head>

<title>标题</title>

</head>

<body>

..........文件内容..........

</body>

</html>

1.文件标题

<title>..........</title>

2.文件更新--<meta>

【1】10秒后自动更新一次

<metahttp-equiv="refresh"content=10>

【2】10秒后自动连结到另一文件

<metahttp-equiv="refresh"content="10;URL=欲连结文件之URL">

3.查询用表单--<isindex>

若欲设定查询栏位前的提示文字:

<isindexprompt="提示文字">

4.预设的基准路径--<base>

<basehref="放置文件的主机之URL">

版面

1.标题文字<h#>..........</h#>#=1~6;h1为最大字,h6为最小字

2.字体变化<font>..........</font>

【1】字体大小<fontsize=#>..........</font>#=1~7;数字愈大字也愈大

【2】指定字型<fontface="字型名称">..........</font>

【3】文字颜色<fontcolor=#rrggbb>..........</font>rr:表红色(red)色码gg:表绿色(green)色码bb:表蓝色(blue)色码

3.显示小字体<small>..........</small>

4.显示大字体<big>..........</big>

5.粗体字<b>..........</b>

6.斜体字<i>..........</i>

7.打字机字体<tt>..........</tt>

8.底线<u>..........</u>

9.删除线<strike>..........</strike>

10.下标字<sub>..........</sub>

11.上标字<sup>..........</sup>

12.文字闪烁效果<blink>..........</blink>

13.换行<br>

14.分段<p>

15.文字的对齐方向<palign="#">#号可为left:表向左对齐(预设值)center:表向中对齐right:表向右对齐P.S.<palign="#">之后的文字都会以所设的对齐方式显示,直到出现另一个<palign="#">改变其对齐方向,或遇到<hr>?<h#>标签时会自动设回预设的向左对齐。

16.分隔线<hr>

【1】分隔线的粗细<hrsize=点数>

【2】分隔线的宽度<hrsize=点数或百分比>

【3】分隔线对齐方向<hralign="#">#号可为left:表向左对齐(预设值)center:表向中对齐right:表向右对齐

【4】分隔线的颜色<hrcolor=#rrggbb>

【5】实心分隔线<hrnoshade>

17.向中对齐<center>..........</center>

18.依原始样式显示<pre>..........</pre>

19.<body>指令的属性

【1】背景颜色--bgcolor<bodybgcolor=#rrggbb>

【2】背景图案--background<bodybackground="图形文件名">

【3】设定背景图案不会卷动--bgproperties<bodybgproperties=fixed>

【4】文件内容文字的颜色--text<bodytext=#rrggbb>

【5】超连结文字颜色--link<bodylink=#rrggbb>

【6】正被选取的超连结文字颜色--vlink<bodyvlink=#rrggbb>

【7】已连结过的超连结文字颜色--alink<bodyalink=#rrggbb>

20.注解<!--..........-->21.特殊字元表示法

符号语法

<&lt

>&gt

&&amp

"&quot

空白&nbsp

图片

1.插入图片<imgsrc="图形文件名">

2.设定图框--border<imgsrc="图形文件名"border=点数>

3.设定图形大小--width?height<imgsrc="图形文件名"width=宽度点数height=高度点数>

4.设定图形上下左右留空--vspace?hspace<imgsrc="图形文件名"vspace=上下留空点数hspace=左右留空点数>

5.图形附注<imgsrc="图形文件名"alt="说明文字">

6.预载图片

<imgsrc="高解析度图形文件名"lowsrc="低解析度图形文件名">P.S.两个图的图形大小最好一致

7.影像地图(ImageMap)<imgsrc="图形文件名"usemap="#图的名称"><mapname="图的名称">

<areashape=形状coords=区域座标列表href="连结点之URL">

<areashape=形状coords=区域座标列表href="连结点之URL">

<areashape=形状coords=区域座标列表href="连结点之URL">

<areashape=形状coords=区域座标列表href="连结点之URL"></map>

【1】定义形状--shape

shape=rect:矩形shape=circle:圆形shape=poly:多边形

【2】定义区域--coords

a.矩形:必须使用四个数字,前两个数字为左上角座标,后两个数字为右下角座标

例:<areashape=rectcoords=100,50,200,75href="URL">

b.圆形:必须使用三个数字,前两个数字为圆心的座标,最后一个数字为半径长度

例:<areashape=circlecoords=85,155,30href="URL">

c.任意图形(多边形):将图形之每一转折点座标依序填入

例:<areashape=polycoords=232,70,285,70,300,90,250,90,200,78href="URL">

表格

1.定义表格<table>..........</table>

【1】设定边框的厚度--border

<tableborder=点数>

【2】设定格线的宽度--cellspacing

<tablecellspacing=点数>

【3】设定资料与格线的距离--cellpadding

<tablecellpadding=点数>

【4】调整表格宽度--width

<tablewidth=点数或百分比>

【5】调整表格高度--height

<tableheight=点数或百分比>

【6】设定表格背景色彩--bgcolor

<tablebgcolor=#rrggbb>

【7】设定表格边框色彩--bordercolor

<tablebordercolor=#rrggbb>

2.显示格线<tableborder>

3.表格标题

<caption>..........</caption>

表格标题位置--align

<captionalign="#">#号可为top:表标题置于表格上方(预设值)

bottom:表标题置于表格下方

4.定义列<tr>

5.定义栏位《1》<td>:靠左对齐

《2》<th>:靠中对齐?粗体

【1】水平位置--align<thalign="#">

#号可为left:向左对齐

center:向中对齐right:向右对齐

【2】垂直位置--align<thalign="#">#号可为

top:向上对齐middle:向中对齐

bottom:向下对齐

【3】栏位宽度--width

<thwidth=点数或百分比>

【4】栏位垂直合并--rowspan

<throwspan=欲合并栏位数>

【5】栏位横向合并--colspan

<thcolspan=欲合并栏位数>

清单

一、目录式清单

<dir><li>项目1<li>项目2<li>项目3</dir>P.S.目录式清单每一个项目不能超过20个字元(即10个中文字)

二、选项式清单<menu><li>项目1<li>项目2<li>项目3</menu>

三、有序号的清单<ol><li>项目1<li>项目2<li>项目3</ol>

【1】序号形式--type<oltype=#>或<litype=#>#号可为A:表以大写英文字母A?B?C?D...做为项目编号a:表以小写英文字母a?b?c?d...做为项目编号I:表以大写罗马数字做为项目编号i:表以小写罗马数字做为项目编号1:表以阿拉伯数字做为项目编号(预设值)

【2】起始数字--start<olstart=欲开始计数的序数>

【3】指定编号--value<livalue=欲指定的序数>

四、无序号的清单<ul><li>项目1<li>项目2<li>项目3</ul>

【1】项目符号形式--type<ultype=#>或<litype=#>#号可为disc:实心圆点(预设值)circle:空心圆点square:实心方块

【2】原始清单--plain<ulplain>

【3】清单排列方式--warp《1》清单垂直排列<ulwarp=vert>《2》清单水平排列<ulwarp=horiz>

五、定义式清单<dl><dt>项目1<dd>项目1说明<dt>项目2<dd>项目2说明<dt>项目3<dd>项目3说明</dl>

紧密排列--compact<dlcompact>P.S.如此可使<dt>的内容与<dd>的内容在同一行,仅以数格空白相隔而不换行,但若<dt>的文字超过一定的长度后,compact的作用就消失了!

表单

一、基本架构<formaction="处理资料用的CGI程式之URL"或"mailto:电子信箱的URL"method="get或post">..............................</form>

二、输入文件型表单<formaction="URL"method="post"><input><input>....................</form>

【1】栏位类型--type<inputtype=#>#号可为text:文字输入password:密码checkbox:多选钮radio:单选钮submit:接受按钮reset:重设按钮image:图形钮hidden:隐藏栏位

【2】栏位名称--name<inputname="资料栏名">P.S.若type为submit?reset则name不必设定

【3】文件上的预设值--value<inputvalue="预设之字串">

【4】设定栏位的宽度--size<inputsize=字元数>

【5】限制最大输入字串的长度--maxlength<inputmaxlength=字元数>

【6】预设checkbox或radio的初值--checked<inputtype=checkboxchecked><inputtype=radiochecked>

【7】指定图形的URL--src<inputtype=imagesrc="图档名">

【8】图文对齐--align<inputtype=imagealign="#">#号可为top:文字对齐图片之顶端middle:文字对齐图片之中间buttom:文字对齐图片之底部

三、选择式表单<formaction="URL"method="post"><select><option><option>....................</select></form>

A、<select>的属性

【1】栏位名称--name<selectname="资料栏位名">

【2】设定显示的选项数--size<selectsize=个数>

【3】多重选项--multiple<selectmultiple>

B、<option>的属性

【1】定义选项的传回值--value<optionvalue="传回值">

【2】预先选取的选项--selected<optionselected>

四、多列输入文字区表单<formaction="URL"method="post"><textarea>....................</textarea></form>

【1】文字区的变数名称--name<textareaname=变数名称>

【2】设定文字输入区宽度--cols<textareacols=字元数>

【3】设定文字输入区高度--rows<textarearows=列数>

【4】输入区设定预设字串<textarea>预设文字</textarea>

【5】自动换行与否--wrap<textareawrap=#>#号可为off:表输入的文字超过栏宽时,不会自动换行(预设值)virtual:表输入的文字在超过栏宽时会自动换行

链接

一、连结至其他文件<ahref="URL">说明文字或图片</a>

二、连结至文件内之某一处(外部连结)

《1》起点

<ahref="档名#名称">..........</a>

《2》终点<aname="名称">

三、frame的超连结

【1】开启新的浏览器来显示连结文件--_blank<ahref="URL"target=_blank>

【2】显示连结文件於目前的frame--_self<ahref="URL"target=_self>

【3】以上一层的分割视窗显示连结文件--_parent<ahref="URL"target=_parent>

【4】以全视窗显示连结文件--_top<ahref="URL"target=_top>

【5】以特定视窗显示连结文件--<ahref="URL"target="特定视窗名称">

FRAME

一、分割视窗指令<frameset>..........</frameset>

【1】垂直(上下)分割--rows

<framesetrows=#>#号可为点数:如欲分割为100,200,300三个视窗,则

<framesetrows=100,200,300>;亦可以号代表,如<framesetrows=,500,>

百分比:如<framesetrows=30%,70%>,各项总和最好为100%

【2】水平(左右)分割--cols<framesetcols=点数或百分比>

二?指定视窗内容--<frame>

<framesetcols=30%,70%><frame><frame></frameset>

【1】指定视窗的文件名称--src<framesrc=HTML档名>

【2】定义视窗的名称--name

<framename=视窗名称>

【3】设定文件与上下边框的距离--marginheight

<framemarginheight=点数>

【4】设定文件与左右边框的距离--marginwidth

<framemarginwidth=点数>

【5】设定分割视窗卷轴--scrolling

<framescrolling=#>#号可为yes:固定出现卷轴

no:不出现卷轴auto:自动判断文件大小需不需要卷轴(预设值)

【6】锁住分割视窗的大小--noresize<framenoresize>





献花(0)
+1
(本文系LJM舞首藏)