html中常用标签的分析（附代码）-木庄网络博客

本文摘自PHP中文网，作者不言，侵删。

本篇文章给大家带来的内容是关于html中常用标签的分析（附代码），有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。

1.1 标签的分类

1.1.1 按主体分类：

1.带主体的标签：如数据

2.不带主体的标签：如 换行标签

判断一个表是否需要带主体，你可以思考该标签是否需要封装数据，如果需要封装数据，那么该标签必定带主体，如果不需要封装数据，那么就不需要带主体。

2.1.2 按行分类：

1.如果一个标签的内容需要独立占一行，我们称作为块标签。比如：<h1>标题标签

2.如果一个标签不需要独立占一行，我们称作为内联标签。比如：字体标签

2.2 文本标签：

标签名	标签描述	常用属性
h1~h6	标题标签，所有标题都是加粗的，1表示1级标题，字最大，6级标题最小	属性是在开始标签里面的 align:设置标题对齐方式 center:居中、right：右对齐、left：左对齐
hr	画一条水平线	width：线长度 size: 粗细 color:颜色
b	对字体加粗，与strong标签功能相同
i	设置字体为斜体
br	换行
font	字体（在HTML5中已经淘汰了）	color：颜色 size：大小 face：指定字体的名字
p	分段，每个p标签就是一个段落，没有首行缩进。段落之间有间隔	如果要缩进，使用&nbsp；半角空格也可全角空格 title：鼠标移上去以后，显示文字提示信息

2.3 块标签与内联标签：

1.div：块标签，需要独立占一行。

2.span:内联标签，不需要独立占一行。

案例文字素材

World Wide Web Consortium万维网联盟创建于1994年

代码演示

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css"></style>
    <script type="text/javascript"></script>
</head>
<body>
<div style="background-color: red">World Wide Web Consortium</div>
万维网联盟创建于1994年
<span style="background-color: aqua">World Wide Web Consortium</span>
万维网联盟创建于1994年
</body>
</html>

2.4 列表标签：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css"></style>
    <script type="text/javascript"></script>
</head>
<body>
今天早上吃什么?
<ol style="color: black" type="A">
    <li>
        油条
    </li>
    <li>
        豆浆
    </li>
    <li>
        稀饭
    </li>
</ol>
明天早上吃什么？
<ul style="color: black" type="disc">
    <li>面</li>
    <li>糯米鸡</li>
</ul>
</body>
</html>