css之 8.面试题会考行内元素和块级元素的特点以及列举说明

8.面试题会考行内元素和块级元素的特点以及列举说明

一、行内元素 通常使用行内元素来进行文字、小图标（小结构）的搭建
标签：a button big datalist em i input mark span select option s
strong b small sup sub textarea u
特点：
1.不独占一行 (一般与文字有关系)
2.排列方式：从左往右
3.设置宽高不起作用，如要起作用，需要转换为块/行内块display:block/display:inline-block
4.不设置宽高 宽高是它本身内容的宽高
5.天生自带 display:inline
6.行内元素不能嵌套块级元素（特殊a 里面可以嵌套块级元素）

二、块级元素 通常使用块级元素来进行大布局（大结构）的搭建
标签：table form dl dd dt figure figcaption div h1-h6 hr ul li ol li nav p
特点：
1.独占一行（表格啊，分块啊之类的）
2.排列方式：从上往下
3.可以设置宽高以及盒子模型的相关css属性
4.不设置宽高的情况下，它的宽度是父元素的宽度，它的高度是本身内容的高度
5.天生自带 display:block
6.块级元素可以嵌套行内元素
7.ul ol 下面只能是li dl下面只能是dt dd
8.p标签里面不能嵌套任何的块级元素 包括它自己本身 可以嵌套行内元素

三、行内块元素 天生自带display:inline-block
（不独占一行，但是设置宽高起作用）
img input