HTML标签分类

HTML标签分类

按闭合特征分类：

• 闭合标签：由开始标签和结束标签共同组成，成对出现，常见的闭合标签有<p></p>、<span></span>、<div></div>等。标签之间的关系可以存在并列及嵌套关系。
• 单标签（空标签）：指没有内容的标签，在开始标签中自带闭合标识符。常见的单标签有<img/>、<hr/>、<link/>、<meta/>、<input/>、<br/>

---

按是否换行分类：

• 块级元素：块级元素是值本身属性为display：block的元素
• 行内元素：行内元素是指本身属性为display：inline的元素，其宽度随着元素的内容而变化。也叫内联元素。

块级元素特点：

• 每一个块级元素独占一行，从上到下排布
• 块级元素可以直接控制宽度高度等盒子模型相关的CSS属性
• 不设宽度的情况下，块级元素的宽度是其父级元素内容的宽度
• 不设高度的情况下，块级元素的高度是他本身内容的高度

常用的块级元素：

标签	描述
div	常用块级容器，也是css和layout的主要标签
h1~h6	一二三四五六级标题
hr	水平分割线
menu	菜单列表
ol、ul 、li	有序列表、无序列表、列表项
dl、dt、dd	自定义列表、定义分类、类项描述
table	表格
p	段落
form	交互表单

行内元素的特点：

• 行内元素会和其他元素从左到右的显示在一行中
• 行内元素不能直接控制宽度高度以及盒子模型相关的css属性，可以设置内外边距的水平方向的值。也就是说，对于内联元素的margin和padding，只有margin-left/margin-right和padding-left/padding-right是有效的。垂直方向的margin和padding无效果。
• 行内元素的宽高是由其内容本身的大小决定的
• 行内元素只能容纳文本或者其他行内元素，不允许在行内元素中嵌套块级元素

常见的行内元素：

标签	描述
a	锚点，连接标签
b	加粗
span	常用的行内标签容器，定义文本内区块
img	引入图片
input	输入框
select	下拉列表
strong	加粗强调
label	input元素定义标注（标记）