块级元素和行级元素特点区别整理

行级元素（行盒：inline）

常见行内元素：span、a、（img、textarea、button、input）、label、select、canvas、audio、video，b, i, strong、em、br、

（img、textarea、button、input）：可设置宽高
基本特点：1、不换行（与其他行级元素共享一行）
2、由于不用来搭建网页结构，宽高不能改变（自适应宽高）
3、img默认是行级元素，但是能修改宽高
4、行级元素内不能嵌套块级元素
5、水平方向排列

面试题：
如果行级与行级元素之间有块级元素，由于块级元素需要独占一行，此时块级元素前后行级元素独占一行

span：无意义的行内元素（通常用来标记某一部分，用来做特定样式）

块级元素（块盒block）

常见的块级元素：html、body、div、header、footer、nav、section、p， h1~h6、ul、form、table、tbody、thead、tfoot、tr等；
基本特点：
1、宽度默认是100%，独占一行（相对于父元素独占一行，视图区是最大父元素），高度由子元素及其内容决定。也可以设置宽高
2、宽高。边距可控制
3、垂直方向排列
4、可以容纳块级元素、行内元素

行块盒（inline-block）

1、有bolck 和 inline的特点
2、不换行（inline的特点）
3、高度，行高以及外边距和内边距可控制（block）；
4、宽度是100%（不是相对浏览器，是相对前一级容器大小）
可以设定一个宽度）
5、可以放置其他块元素以及行元素（block）

？ 块级元素和行级元素的区别

1、块级元素可以改变宽高，行级元素不能
2、块级元素可以容纳行级元素和块级元素，行级元素内不能容纳块级元素
3、行内水平方向排列，块级垂直方向排列