html中的标签详解
1.文档构造标签:主要用来标识文档的根本构造
a) <html></html>:标识HTML文档的起始和终止
b) <head></head>:标识HTML文档的头部区域
c) <body></body>:标识HTML文档的主体区域
2.文本格局标签:主要用来标识文本区块,并附带必然的显示格局
a) <title></title>:表识网页标题
b) <hi></hi>:标识标题文本,其中i表示1~6,离别表示1级、二级等标题
c) <p></p>:标识段落文本
d) <pre></pre>:标识预定义文本
e) <blockquote></blockquote>:标识援用文本
3.字符格局标签:主要用来标识部分文本字符的语义,如加粗/歪体/下划线显示
a) <b></b>:标识强调文本,以加粗结果显示
b) <i></i>:标识援用文本,以歪体结果显示
c) <blink></blink>:标识闪耀文本,以闪耀结果显示(IE阅读器不支撑该标签)
d) <big></big>/<small></small>:标识放大/缩小文本,以放大/缩小结果显示
e) <sup></sup>:标识上文本,以上标结果显示
f) <sub></sub>:标识下文本,以下标结果显示
g) <cite></cite>:标识援用文本,以援用结果显示
使用各种字符格局标签显示一个数学方程式的解法
<!DOCTYPE html>
<htmllang="en">
<head>
<metacharset="UTF-8">
<title>字符格局标签</title>
</head>
<body>
<p>针对下面这个一元二次方程:</p>
<p><i>x</i><sup>2</sup>-<b>5</b><i>x</i>+<b>4</b>=0</p>
<p>我们使用<big><b>分解因式法</b></big>来演示解题如下:</p>
<p><small>由:</small>(<i>x</i>-1)(<i>x</i>-4)=0</p>
<p><small>得:</small><br/><i>x</i><sub>1</sub>=1
<br/><i>x</i><sub>2</sub>=4</p>
</body>
</html>
4.列表标签:在HTML中列表构造可以分为两品种型:有序列表和无序列表.无序列表使用项目符号来标识列表,而有序列表则是用编号来标识列表的项目次序.
a) <ul><li>...</li></ul>:标识无序列表.<li></li>:标识列表项目
b) <ol><li>...</li></ol>:标识有序列表.<li></li>:标识列表项目
i. 使用无序列表和有序列表离别显示一元二次方程求解的4种办法
<!DOCTYPE html>
<htmllang="en">
<head>
<metacharset="UTF-8">
<title>列表标签</title>
</head>
<body>
<h1>解一元二次方程</h1>
<p>无序列表列出4种办法:</p>
<ul>
<li>直接开平办法</li>
<li>配办法</li>
<li>公式法</li>
<li>分解因式法</li>
</ul>
<p>有序列表列出4种办法:</p>
<ol>
<li>直接开平办法</li>
<li>配办法</li>
<li>公式法</li>
<li>分解因式法</li>
</ol>
</body>
</html>
c) <dl><dt>...</dt><dd>...</dd></dl>:自定义列表,包罗词条和说明两部分内容.
i. <dl></dl>标识定义列表;<dt></dt>:标识词条;<dd></dd>:标识说明
ii. 使用定义列表显示两个成语的说明
<!DOCTYPE html>
<htmllang="en">
<head>
<metacharset="UTF-8">
<title>列表标签</title>
</head>
<body>
<dl>
<dt>畅所欲言,直抒胸意</dt>
<dd>知道的就说，要说就毫无不保存</dd>
<dt>智者千虑,必有一失</dt>
<dd>不管多聪慧的人,在许多的思考中,也必然会显现一般错误</dd>
</dl>
</body>
</html>
5.链接标签:实现把多个网页联络在一起
a) <a></a>:标识超链接.还可以定义锚点.锚点是一类非凡的超链接,它可以定位带网页中某个详细的位置.例如鄙人面实例中单击超链接文本,就可以跳转到页面的顶部.
<!DOCTYPE html>
<htmllang="en">
<head>
<metacharset="UTF-8">
<title>链接标签</title>
</head>
<body>
<spanid="top">底部锚点位置</span>
<divid="box"style="height:2000px;border:solid1px red">撑开阅读器的滚动条</div>
<ahref="#top">单击返回顶部</a>
</body>
</html>
6.多媒体标签:主要用于引入外部多媒体文件停止显示.
a) <img></img>:嵌入图像
b) <embed></embed>:嵌入多媒体
c) <object></object>:嵌入多媒体
7.表格标签:用来组织和治理数据.
a) <table></table>:定义表格构造
b) <caption></caption>:定义表格标题
c) <th></th>:定义表头
d) <tr><td>...</td></tr>:<tr></tr>定义表格行;<td>...</td>定义表格单元格
<!DOCTYPE html>
<htmllang="en">
<head>
<metacharset="UTF-8">
<title>表格</title>
</head>
<body>
<tablesummary="使用表格构造显示3行2列数据集"border="1">
<caption>ASCII字符集</caption>
<tr>
<th>十进制</th>
<th>十六进制</th>
</tr>
<tr>
<td>9</td>
<td>9</td>
</tr>
<tr>
<td>10</td>
<td>A</td>
</tr>
</table>
</body>
</html>
8.表单标签:主要用来制作交互式表单.
a) <form></form>:定义表单构造
b) <input/>:定义文本域、按钮和复选
c) <textarea></textarea>:定义多行文本框
d) <select></select>:定义下拉列表
e) <option></option>:定义下拉列表中选中项目
<!DOCTYPE html>
<htmllang="en">
<head>
<metacharset="UTF-8">
<title>表单</title>
</head>
<body>
<formaction=""method="post">
<p>单行文本域:<inputtype="text"/></p>
<p>密码域:<inputtype="password"/></p>
<p>多行文本域:<textareaname="textareafield"value=""></textarea></p>
<p>复选框:<br>复选框1<inputtype="checkbox"name="box1"value=""/>舞蹈<br>
复选框2<inputtype="checkbox"name="box2"value=""/>唱歌<br>
</p>
<p>单选按钮:
<inputtype="radio"name="radio"value="nan">按钮1
<inputtype="radio"name="radio"value="nv">按钮2<br>
</p>
<p>下拉菜单:
<selectname="selectlist">
<optionvalue="1">选项1</option>
<optionvalue="2">选项2</option>
<optionvalue="3">选项3</option>
</select>
</p>
<p><inputtype="submit"name="button"id="button"value="提交"/></p>
</form>
</body>
</html>
相关引荐：
怎样让数据里html字段转换为HTML标签
html标签分类
带有html标签的字符串转换为HTML标签
以上就是html中的标签详解的具体内容，更多请关注百分百源码网其它相关文章！
