块级元素和行内元素

块级元素列表

标签	释义
address	定义地址
caption	定义表格标题
dd	定义列表中定义条目
dt	定义列表中的项目
dl	定义列表
div	定义文档中的分区或节
fieldset	定义框架集
legend	元素为fieldset元素定义标题
form	创建HTML表单
h1~h6	定义各级标题
hr	创建一条水平线
li	标签定义列表项目
noframe	为那些不支持框架的浏览器显示文本，于frameset元素内部
noscript	定义脚本未被执行时的替代内容
ol	定义有序列表
ul	定义无序列表
p	标签定义段落
pre	定义预格式化文本
table	标签定义HTML表格
tbody	标签定义表格主体
thead	标签定义表格的表头
tfoot	标签定义表格的页脚
th	定义表头单元格
td	定义表格中标准单元格
tr	定义表格中的行

---

行内元素

标签	释义
a	定义链接或锚点
abbr	表示一个缩写形式
acronym	定义只取首字母缩写
b	字体加粗
bdo	可覆盖的默认文本方向
big	大号字体加粗
br	换行
cite	引用进行定义
code	定义计算机代码文本
dfn	定义一个定义项目
em	定义强调的内容
i	斜体文本效果
img	向网页嵌入图片
input	输入框
kdb	定义键盘文本
label	标签为input元素定义标注
q	定义短的引用
samp	定义样本文本
select	创建单选或多选菜单
small	呈现小号字体效果
span	组合文档中的行内元素
strong	语气更强的强调内容
sub	定义下标文本
sup	定义上标文本
textarea	多行文本输入控件
tt	打字机或者等宽字体效果
var	定义变量
button	按钮

---

行内元素与块级元素区别

1. 行内元素于块级元素直观上的区别

• 行内元素会在一条直线上排列，都是同一行的，水平方向。
• 块级元素各占一行，垂直方向排列，块级元素从新行开始结束接着一个断行。

2. 块级元素可以包含行内元素和块级元素，行内元素不能包含块级元素。
3. 行内元素于块级元素属性不同，主要是盒模型属性上
4. 行内元素设置width、height无效（可以设置line-height），margin、padding上下无效。

---

行内元素和块级元素可以互相转换

• display:block——行内元素转换为块级元素；
• display：inline-block——行内元素/块级元素转换为行内块级元素，表现为行内元素，但是带有块级元素的属性；
• display：inline——块级元素转换为行内元素。