常见HTML标记及含义讲解
相关主题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
<td width="45%" rowspan="2">dsddsd</td>单元格标记（跨行合并）
</tr>
<tr>
<td height="22">ds</td>
<td>sd</td>
</tr>
</table>
Width表格宽度border边宽cellspacing间距cellpadding填充bordercolor边框颜色background背景图片bgcolor背景色bordercolorlight表格左上单元格右下bordercolordark表格右下单元格左上
</ol>
</li>
</ol>
七、图片标记
1、<img src="banner资料.jpg" alt="aaa" width="100" height="200" hspace="2" vspace="1" border="2" align="middle" lowsrc="../images/cpfl_04.gif" longdesc="http://www.163.com" />
<input name="textfield3" type="password" value="123" size="2" maxlength="3" />
Input（单行）：size字符个数maxlength最大长度value初始值
type：text（单行文本）password（密码文本）file（文件域）radio（单选）checkbox（多选）submit（按钮）image（图像域）hidden（隐藏域）button（无）reset（重设）submit（提交）
6、alink鼠标点击时的颜色
7、vlink点击后的颜色
8、topmargin页面上边距
9、leftmargin页面左边距
五、注释语句
1、<comment></comment >
2、<!-- -->
3、<plaintext>将原代码显示在浏览器中
4、<ruby> ssssssssssss<rt>ddddd</rt></ruby>rt的注释内容出现在ruby上方
<caption align="top">标题
中华网
</caption>
<tralign="center" valign="middle" bordercolordark="#9900FF" bordercolorlight="#FF0000">行标记
<thwidth="50%" height="25"> </th>单元格表头
<li type="square">kjkjhkhj</li>方
</ul>
17、<ol type="1" start="2">编号列表，type代表显示什么，start代表从那开始
<li>fdfsdfs</li>
<li>fsfsfs </li>
</ol>
</body>
18、<dl>定义列表（产生类似文字说明的效果）
使用：插入栏/html/文件头/meta【name-搜索引擎http-equiv-设置浏览器检查信息，控制网页精确显示】
格式：<meta name="author" content="宋赟中" />（作者）
<meta name="keywords" content="网络，计算机学校" />（关键字）
<option>3</option>
</select>
跳转和列表的区别：都是菜单，不同的是跳转多了一个超级链接的功能
十一、框架
1、<frameset rows="400,200" cols="*" framespacing="2" frameborder="yes" border="2" bordercolor="#9900FF">框架集
5、、/* */ css注释
六、文本标记
1、<h数字></h数字>标题字标记包含对齐（align）属性
2、<strong> </strong>加粗标记
3、<em></em>倾斜
4、<s></s>删除线
5、<u></u>下划线
6、<sup></sup>上标
7、<sub></sub>下标
8、<big></big>大字号
frame外部边框显示样式above（上）below（下）border（全显示）hisdes（上下）lhs（左）rhs（右）void（不显示）vsides（左右）
rules内部边框显示样式all（所有）cols（行）groups（行列间）none（不显示）rows（列）
十、表单
1、<form action="" method="get">具体表单</form>表单标记
<meta name="description" content="忙忙忙忙忙忙忙忙忙忙" />（说明）
<meta name="build" content="建设时间"/>
<meta name="reply-to" content="联系人邮箱"/>
<meta name="copyright" content="版权说明"/>
<td> </td>
</tr>
</table>
<table width="56%" height="84" border="1" cellpadding="2" cellspacing="3" summary="这是中华网的内部资料">表格标记
<caption align="top">说明
7、<small></small>小字号
8、<font face="字体" size="字号" color="颜色"></font>文字标记
9、<p></p>段落标记具备align属性
10、<pre> </pre>预格式化（使得代码与页面的显示一致）
11、<center></center>居中
12、<hr align="对齐" width="宽" size="高" noshade="阴影"color/>水平线
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />（字符集）
<meta name=<meta http-equiv="refresh" content="22" />（刷新）
<meta http-equiv="windows-target" content="_top" />（强制独立窗口打开）
中华网
</caption>
<tr>行标记
<th width="36%" height="22">dsds</th>标题单元格标记
<td colspan="2">dsddsd</td>单元格标记（跨列合并）
</tr>
<tr>
<td height="22">ds</td>height高
<td width="19%">sd</td>width宽
Src图片文件的路径alt说明文字width宽度height高度hspace水平边距vspace垂直边距border边框宽度align文字环绕lowsrc低解析度源文件
2、<br clear="left" />代码加到对应前边可以取消环绕
3、<img src="../images/未标题-1_03.gif"usemap="#Map"/>应用区域
<map name="Map" id="Map">使用热点
<area shape="circle" coords="81,54,16" href="#" />定义热点区
</map>
Cords区域边界href链接shape（热点类型）circle圆rect矩形poly多边形
主要用于电子地图和导航条
八、链接
<td width="50%"nowrap="nowrap" bordercolor="#00FFFF" background="html/banner资料.jpg" bgcolor="#FF00FF"> </td>单元格标记width宽height高nowrap不换行
</tr>
<tr>
<td height="26"> </td>
onchange="MM_jumpMenu('parent',this,0)">如果出现代表跳转
<option value="http://www.163.com">1</option>菜单项目value如果是跳转代表超链
<option selected="selected">2</option>selected（已选中）
3、<ahref="maileto:aa@163.com? subject=意见&cc=123@123.com&bcc=mm@163.com">hkhjk</a>
Subject标题cc抄送bcc秘抄送
九、表格
1、基本标记
<table widthLeabharlann Baidu"56%" height="56" border="1" align="center" cellpadding="2" cellspacing="3" bordercolor="#FF00FF" background="file:///C|/Documents and Settings/Administrator/桌面/html/banner资料.jpg" bgcolor="#00FFFF"summary="这是内部资料">表格标记
实例：添加一个标题
2、base基底网址标记
功能：文档的基本网址，其他为与其相对的网址
使用：插入栏/html/文件头/基础
格式：<base href="http://www.163.com" target="父(_P)" />
实例：设置后，在文章中添加一个相对路径和绝对路径
4、media原信息标记
功能：提高被搜索引擎搜索到的可能性
1、<a href="http://www.163.com" target="_parent" name="链接名" title="链接提示文字">fhgfhf</a>href链接target打开方式name连接名title链接提示文本链接（）
2、<a name="mm" id="mm"></a>锚点链接
2、<label>aa标签/单行文本
<input name="textfield" type="text" value="" size="2"maxlength="4"/>文本
</label>
<textarea name="textfield2" cols="2" rows="4" wrap="virtual">mmmmmmmmmm</textarea>
<dt>fdfsdfs</dt>内容
<dd>fsfsfs </dd>说明
<dt>kjkjhkhj</dt>
<dd>hfhfhfhfh</dd>
</dl>
19、<ol>列表嵌套（选中内容，缩进）
<li>dadasd</li>
<li>adsasdsa
<ol>
<li>dasda</li>
<li>sdaad</li>
<meta http-equiv="pragma" content="No-cach />（页面不允许缓存）
实例：设置后，会提高搜索引擎的命中率
四、body标记
1、bgcolor背景色
2、background背景图像
3、text文字颜色
4、bgproperties背景滚动方式fixed代表固定
5、link默认链接颜色
一、html基础知识
二、html结构
<html>
<head>
<title>网络0801</title>
</head>
<body>
</body>
</html>
基本标记
.<p></p>段落<br>换行
三、head内的标记
1、title标题标记
功能：标题控制
使用：设置标题
格式：<title>标题内容</title>
当选组：其实就是把多个当选按钮放在一个表单内
标签：<label></label>对表单内容的说明
3、textarea（多行）：cols个数rows行数wrap超过处理多行文本
4、
<select name="menu1" size="1" multiple="multiple"菜单名size(列表）multiple(允许多选)
13、<kbd> </kbd>在浏览器中（如标签后）显示的信息
14、<address> </address>在文档中显示作者的信息
15、<tt> </tt>打字字体
16、<ul>项目列表
<li type="circle">fdfsdfs</li>空心圆
<li type="disc">fsfsfs </li>圆
</tr>
<tr>
<td height="22">ds</td>
<td>sd</td>
</tr>
</table>
Width表格宽度border边宽cellspacing间距cellpadding填充bordercolor边框颜色background背景图片bgcolor背景色bordercolorlight表格左上单元格右下bordercolordark表格右下单元格左上
</ol>
</li>
</ol>
七、图片标记
1、<img src="banner资料.jpg" alt="aaa" width="100" height="200" hspace="2" vspace="1" border="2" align="middle" lowsrc="../images/cpfl_04.gif" longdesc="http://www.163.com" />
<input name="textfield3" type="password" value="123" size="2" maxlength="3" />
Input（单行）：size字符个数maxlength最大长度value初始值
type：text（单行文本）password（密码文本）file（文件域）radio（单选）checkbox（多选）submit（按钮）image（图像域）hidden（隐藏域）button（无）reset（重设）submit（提交）
6、alink鼠标点击时的颜色
7、vlink点击后的颜色
8、topmargin页面上边距
9、leftmargin页面左边距
五、注释语句
1、<comment></comment >
2、<!-- -->
3、<plaintext>将原代码显示在浏览器中
4、<ruby> ssssssssssss<rt>ddddd</rt></ruby>rt的注释内容出现在ruby上方
<caption align="top">标题
中华网
</caption>
<tralign="center" valign="middle" bordercolordark="#9900FF" bordercolorlight="#FF0000">行标记
<thwidth="50%" height="25"> </th>单元格表头
<li type="square">kjkjhkhj</li>方
</ul>
17、<ol type="1" start="2">编号列表，type代表显示什么，start代表从那开始
<li>fdfsdfs</li>
<li>fsfsfs </li>
</ol>
</body>
18、<dl>定义列表（产生类似文字说明的效果）
使用：插入栏/html/文件头/meta【name-搜索引擎http-equiv-设置浏览器检查信息，控制网页精确显示】
格式：<meta name="author" content="宋赟中" />（作者）
<meta name="keywords" content="网络，计算机学校" />（关键字）
<option>3</option>
</select>
跳转和列表的区别：都是菜单，不同的是跳转多了一个超级链接的功能
十一、框架
1、<frameset rows="400,200" cols="*" framespacing="2" frameborder="yes" border="2" bordercolor="#9900FF">框架集
5、、/* */ css注释
六、文本标记
1、<h数字></h数字>标题字标记包含对齐（align）属性
2、<strong> </strong>加粗标记
3、<em></em>倾斜
4、<s></s>删除线
5、<u></u>下划线
6、<sup></sup>上标
7、<sub></sub>下标
8、<big></big>大字号
frame外部边框显示样式above（上）below（下）border（全显示）hisdes（上下）lhs（左）rhs（右）void（不显示）vsides（左右）
rules内部边框显示样式all（所有）cols（行）groups（行列间）none（不显示）rows（列）
十、表单
1、<form action="" method="get">具体表单</form>表单标记
<meta name="description" content="忙忙忙忙忙忙忙忙忙忙" />（说明）
<meta name="build" content="建设时间"/>
<meta name="reply-to" content="联系人邮箱"/>
<meta name="copyright" content="版权说明"/>
<td> </td>
</tr>
</table>
<table width="56%" height="84" border="1" cellpadding="2" cellspacing="3" summary="这是中华网的内部资料">表格标记
<caption align="top">说明
7、<small></small>小字号
8、<font face="字体" size="字号" color="颜色"></font>文字标记
9、<p></p>段落标记具备align属性
10、<pre> </pre>预格式化（使得代码与页面的显示一致）
11、<center></center>居中
12、<hr align="对齐" width="宽" size="高" noshade="阴影"color/>水平线
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />（字符集）
<meta name=<meta http-equiv="refresh" content="22" />（刷新）
<meta http-equiv="windows-target" content="_top" />（强制独立窗口打开）
中华网
</caption>
<tr>行标记
<th width="36%" height="22">dsds</th>标题单元格标记
<td colspan="2">dsddsd</td>单元格标记（跨列合并）
</tr>
<tr>
<td height="22">ds</td>height高
<td width="19%">sd</td>width宽
Src图片文件的路径alt说明文字width宽度height高度hspace水平边距vspace垂直边距border边框宽度align文字环绕lowsrc低解析度源文件
2、<br clear="left" />代码加到对应前边可以取消环绕
3、<img src="../images/未标题-1_03.gif"usemap="#Map"/>应用区域
<map name="Map" id="Map">使用热点
<area shape="circle" coords="81,54,16" href="#" />定义热点区
</map>
Cords区域边界href链接shape（热点类型）circle圆rect矩形poly多边形
主要用于电子地图和导航条
八、链接
<td width="50%"nowrap="nowrap" bordercolor="#00FFFF" background="html/banner资料.jpg" bgcolor="#FF00FF"> </td>单元格标记width宽height高nowrap不换行
</tr>
<tr>
<td height="26"> </td>
onchange="MM_jumpMenu('parent',this,0)">如果出现代表跳转
<option value="http://www.163.com">1</option>菜单项目value如果是跳转代表超链
<option selected="selected">2</option>selected（已选中）
3、<ahref="maileto:aa@163.com? subject=意见&cc=123@123.com&bcc=mm@163.com">hkhjk</a>
Subject标题cc抄送bcc秘抄送
九、表格
1、基本标记
<table widthLeabharlann Baidu"56%" height="56" border="1" align="center" cellpadding="2" cellspacing="3" bordercolor="#FF00FF" background="file:///C|/Documents and Settings/Administrator/桌面/html/banner资料.jpg" bgcolor="#00FFFF"summary="这是内部资料">表格标记
实例：添加一个标题
2、base基底网址标记
功能：文档的基本网址，其他为与其相对的网址
使用：插入栏/html/文件头/基础
格式：<base href="http://www.163.com" target="父(_P)" />
实例：设置后，在文章中添加一个相对路径和绝对路径
4、media原信息标记
功能：提高被搜索引擎搜索到的可能性
1、<a href="http://www.163.com" target="_parent" name="链接名" title="链接提示文字">fhgfhf</a>href链接target打开方式name连接名title链接提示文本链接（）
2、<a name="mm" id="mm"></a>锚点链接
2、<label>aa标签/单行文本
<input name="textfield" type="text" value="" size="2"maxlength="4"/>文本
</label>
<textarea name="textfield2" cols="2" rows="4" wrap="virtual">mmmmmmmmmm</textarea>
<dt>fdfsdfs</dt>内容
<dd>fsfsfs </dd>说明
<dt>kjkjhkhj</dt>
<dd>hfhfhfhfh</dd>
</dl>
19、<ol>列表嵌套（选中内容，缩进）
<li>dadasd</li>
<li>adsasdsa
<ol>
<li>dasda</li>
<li>sdaad</li>
<meta http-equiv="pragma" content="No-cach />（页面不允许缓存）
实例：设置后，会提高搜索引擎的命中率
四、body标记
1、bgcolor背景色
2、background背景图像
3、text文字颜色
4、bgproperties背景滚动方式fixed代表固定
5、link默认链接颜色
一、html基础知识
二、html结构
<html>
<head>
<title>网络0801</title>
</head>
<body>
</body>
</html>
基本标记
.<p></p>段落<br>换行
三、head内的标记
1、title标题标记
功能：标题控制
使用：设置标题
格式：<title>标题内容</title>
当选组：其实就是把多个当选按钮放在一个表单内
标签：<label></label>对表单内容的说明
3、textarea（多行）：cols个数rows行数wrap超过处理多行文本
4、
<select name="menu1" size="1" multiple="multiple"菜单名size(列表）multiple(允许多选)
13、<kbd> </kbd>在浏览器中（如标签后）显示的信息
14、<address> </address>在文档中显示作者的信息
15、<tt> </tt>打字字体
16、<ul>项目列表
<li type="circle">fdfsdfs</li>空心圆
<li type="disc">fsfsfs </li>圆