您的位置：首页 > Web前端 > HTML

HTML 4 常用标签有哪些，都有哪些作用

2011-01-05 22:31 369 查看
一.html框架类标签

1. html -- 定义html文档-- 代表HTML文档的开始.html标签是成对出现的,以
<html>
开始, 
</html>
结束

属性 Common-- 一般属性 xml:lang-- 国际化属性 xmlns -- 代表xml命名空间 dir-- 定义元素(文字)的对齐方式

2.body -- 定义文档体body -- 代表HTML文档的主体 .body标签是成对出现的,以
<body>
开始,
</body>
结束

属性 Common-- 一般属性

3.head -- 定义文档头信息head -- 代表HTML文档的头信息 .head标签是成对出现的,以
<head>
开始,
</head>
结束

属性 Common -- 一般属性

4. title -- 定义文档的标题title-- 代表HTML文档的标题 .title标签是成对出现的,以
<title>
开始,
</title>
结束

属性 Common -- 一般属性

5.<!-- ... --> -- [[html注释]]标签HTML注释的开始使用
<!--
,结束使用
—>.


HTML注释语法 
<!--
注释的内容
—>如：

<!--
闫妍的博客链接
-->

<
a
href
=
"
http://doubleyan.cnblog.com/
">
学习
</
a
>
<!--
链接结束
-->

[/code]
二.html图像与链接类标签
1.a -- html链接标签a -- 代表HTML链接.a标签是成对出现的,以
<a>
开始, 
</a>
结束
属性.

Common-- 一般属性
accesskey -- 代表一个链接的快捷键访问方式
charset
 -- 指定了链接到的页面所使用的编码方式,比如
UTF-8

coords
 -- 使用图像地图的时候可以使用此属性定义链接的区域,通常是使用x,y坐标
href-- 代表一个链接源(就是链接到什么地方)
hreflang
 -- 指出了链接到的页面所使用的语言编码
rel-- 代表文档与链接到的内容(href所指的内容)的关系
rev-- 代表文档与链接到的内容(href所指的内容)的关系
shape
 -- 使用图像地图的时候可以使用shape指定链接区域
tabindex-- 代表使用"tab"键,遍历链接的顺序
target-- 用来指出哪个窗口或框架应该被此链接打开
title-- 代表链接的附加提示信息
type
 -- 代表链接的MIME类型

a,是anchor(锚)的第一个字母

2.img -- html图像标签img-- 代表HTML图像.img标签是单独出现的,
<img />


属性:

Common-- 一般属性
alt -- 代表图像的替代文字
src
 -- 代表一个图像源(就是图像的位置)
height
 -- 代表一个图像的高度
width
 -- 代表一个图像的宽度

img,是image(图像)的缩写

三.html文字相关标签
1h -- 定义标题1至标题6 h1, h2, h3, h4, h5, h6-- 文章的标题标签 。h标签是成对出现的,以
<h>
开始,以
</h>
结束

属性:

Common-- 一般属性

2. p -- html段落标签p-- 段落标签,里面可以加入文字,列表,表格等 。p标签是成对出现的,以
<p>
开始,以
</p>
结束

属性:

Common-- 一般属性

p是paragraph的缩写

3.div -- html层div-- 块标签 。

<div> 标签可以把文档分割为独立的、不同的部分。它可以用作严格的组织工具，并且不使用任何格式与其关联。
如果用 id 或 class 来标记 <div>，那么该标签的作用会变得更加有效。
用法
<div> 是一个块级元素。这意味着它的内容自动地开始一个新行。实际上，换行是 <div> 固有的唯一格式表现。
div标签是成对出现的,以
<div>
开始,以
</div>
结束

就像span标签一样,和CSS联合起来才能显示出它的威力
属性:

Common-- 一般属性

实例
文档中的一个部分会显示为绿色：
<div style="color:#00FF00">

<h3>This is a header</h3>
<p>This is a paragraph.</p>
</div>

[/code]
4. strong -- 定义要强调显示的内容strong 。strong标签是成对出现的,以
<strong>
开始,以
</strong>
结束

属性:

Common-- 一般属性

四.html列表标签

1.ul -- 定义html列表ul-- 代表HTML无序列表 .ul标签是成对出现的,以
<ul>
开始,
</ul>
结束 .

每一列使用
<li>
标签定义,每一列使用一个点作为开头
属性:

Common-- 一般属性

ul，是unordered lists的缩写，中文"无序列表"的意思

2.li -- 定义html列表内容li-- 代表HTML列表项目 .li标签是成对出现的,以
<li>
开始,
</li>
结束

属性:

Common -- 一般属性

li，是list item的缩写，中文"列表项"的意思

五.html表格类标签
1.table -- 定义html表格table .table标签是成对出现的,以
<table>
开始,以
</table>
结束

属性

Common-- 一般属性
summary-- 代表表格的摘要说明
width
 -- 代表表格的宽度
border-- 代表表格边框(此属性应该使用CSS实现)
cellspacing -- 代表表格边框与表格内容填充的距离,也是内容填充之间的距离(此属性应该使用CSS实现)
cellpadding-- 代表内容填充的宽度(此属性应该使用CSS实现)

table，中文"表格"的意思

2.tr -- 定义表格行tr-- 代表HTML表格中的一行 .

tr 元素包含一个或多个 th 或 td 元素。
tr标签是成对出现的,以
<tr>
开始,
</tr>
结束

属性

Common-- 一般属性
align-- 代表行的水平对齐方式(left(左对齐) | center(居中对齐) |right(右对齐) | justify)(此属性应该使用CSS实现)
valign-- 代表行的垂直对齐方式(top(顶部对齐) | middle(中部对齐) | bottom(下部对齐) | baseline(基线对齐))(此属性应该使用CSS实现)

tr，是"table row"的缩写，中文"表行"

实例
一个简单的 HTML 表格，包含两行两列：
<table border="1">
[code]<tr>

<th>Month</th>
<th>Savings</th>
</tr>

<tr>

<td>January</td>
<td>$100</td>
</tr>

</table>
[/code]
3.td -- 定义表格列td-- 代表HTML表格中的一个单元格 .
HTML 表格有两类单元格：

表头单元 - 包含头部信息（由 th 元素创建）
标准单元 - 包含数据（由 td 元素创建）

td 元素中的文本一般显示为正常字体且左对齐。
td标签是成对出现的,以
<td>
开始,
</td>
结束

属性

Common-- 一般属性
abbr- 代表表头的简写
axis
 -- 对单元格在概念上分类
colspan-- 一行跨越多列
headers-- 连接表格的数据与表头
rowspan -- 一列跨越多行
scope-- 定义行或列的表头
align -- 代表水平对齐方式(left(左对齐) | center(居中对齐) | right(右对齐) | justify)(此属性应该使用CSS实现)
valign-- 代表垂直对齐方式(top(顶部对齐) | middle(中部对齐) | bottom(下部对齐) | baseline(基线对齐))(此属性应该使用CSS实现)

td，是"table data cell"的缩写，中文"表中的数据单元"

实例
一个简单的 HTML 表格，包含两行两列：
<table border="1">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
[code]<td>January</td>

<td>$100</td>

</tr>
</table>
[/code]
实例
普通的 HTML 表格，包含两行两列：
<table border="1">
<tr>
[code]<th>Company</th>

<th>Address</th>

</tr>

<tr>
<td>Apple, Inc.</td>
<td>1 Infinite Loop Cupertino, CA 95014</td>
</tr>
</table>
[/code]
六.html表单类标签

1.form -- html表单标签form-- 代表HTML表单 .

<form> 标签用于为用户输入创建 HTML 表单。
表单能够包含 input 元素，比如文本字段、复选框、单选框、提交按钮等等。
表单还可以包含 menus、textarea、fieldset、legend 和 label 元素。
表单用于向服务器传输数据。
form标签是成对出现的,以
<form>
开始,以
</form>
结束

属性.

Common-- 一般属性
action-- 浏览者输入的数据被传送到的地方,比如一个PHP页面(dreamdu.php)
method -- 数据传送的方法
enctype-- 表示将数据发送到服务器时浏览器使用的编码类型

2. input -- 定义一个表单的输入域input-- 代表HTML表单的单行输入域 .input标签是单独出现的,
<input />


属性.

Common -- 一般属性
type -- 代表一个输入域的显示方式(分为输入型,选择型,点击型)
value
 -- 输入域的值
size
 -- 输入域的长度
maxlength
 -- 输入域最多可以输入文字的长度
checked -- 如果是选择型的输入域,代表已经被选择
readonly -- 输入域可以选择,但是无法修改
disabled-- 输入域无法获得焦点,无法选择,以灰色显示,在表单中不起任何作用
accesskey -- 表单的快捷键访问方式
tabindex-- 输入域的"tab"键遍历顺序
src
 -- 当使用图片来表示按钮时,代表图片的位置(URI)
alt -- 用来替换提交按钮的图片(当在input的src属性定义的图片无法显示时)

3.select -- 定义可选择的html表单select-- 选择列表标签 .select标签是成对出现的,以
<select>
开始,以
</select>
结束

此标签中的每对
option
标签代表一个选择项
属性:

Common -- 一般属性
size
 -- 选择域的高度
multiple
 -- 可以有多个选择
disabled-- 输入框无法获得焦点,无法选择,以灰色显示,在表单中不起任何作用
tabindex -- 使用"tab"键的遍历顺序

4.textarea -- 定义一个多行的文字输入域textarea-- 代表HTML表单多行输入域 .textarea标签是成对出现的,以
<textarea>
开始,以
</textarea>
结束

属性:

Common-- 一般属性
cols
 -- 多行输入域的列数
rows
 -- 多行输入域的行数
accesskey-- 表单的快捷键访问方式
disabled-- 输入域无法获得焦点,无法选择,以灰色显示,在表单中不起任何作用
readonly-- 输入域可以选择,但是无法修改
tabindex-- 输入域,使用"tab"键的遍历顺序

(XHTML1.1的属性集合：

一.原属性 Core

1.xml:space ("default"* | "preserve")

2.class(NMTOKENS)：class属性 -- 用于链接一个样式与HTML元素 。

<
div
 
class
=
"
dreamdu1
"
>
连接div标签与dreamdu1样式
<
div
>

<
div
 
class
=
"
dreamdu12px dreamdublack dreamdubold
"
>
使用空格分开多个样式连接div标签
<
div
>
3.id(ID)id属性 -- 唯一标识一个元素的属性 。
4.title(CDATA）title属性 -- 为链接、图像、表单等HTML元素提供描述性的信息


title属性取值:

文字

title，中文"标题"的意思

<
a
 
href
=
http://doubleyan.cnblog.com/
 
title
=
"闫妍的博客
"
>
闫妍的博客
</
a
>


二.I18N属性 Internationalization

1.xml:lang (CDATA)xml:lang 属性 -- xml语言声明属性

此属性可以使用在任何XHTML或XML标签上
此属性符合GNU I18N规范
取值:可以参考rfc3066标准

三.事件属性 UI events

1.onclick (Script)

2.ondblclick (Script)

3.onmousedown (Script)

4.onmouseup (Script)

5.onmouseover (Script)

6.onmousemove (Script)

7.onmouseout (Script)

8.onkeypress (Script)

9.onkeydown (Script)

10.onkeyup (Script)

四.样式属性 Style

1.style (CDATA)style属性 -- 定义HTML标签所使用的样式

一般属性Common = Core + Events + I18N + Style

私有属性：
1.链接或表单元素等的accesskey属性.accesskey 属性 -- 代表链接的快捷键访问方式

定义了accesskey的链接可以使用快捷键(ALT+字母)访问.
主菜单与导航菜单使用accesskey,通常是不错的选择.
取值:

字母

<
a
 
href
=
http://doubleyan.cnblog.com/
 
accesskey
=
"a
"
>
(按住Alt键)点击键盘上的a按钮，再按回车(IE)就可以直接链接到闫妍的博客.
</
a
>

2.链接的href属性href属性指定了链接的位置,这个位置可以用URI(统一资源标识符)表示.[/code]
)
                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航