块级元素 block 块级元素，顾名思义，该元素呈现“块”状，所以它有自己的宽度和高度，也就是可以自定义width和height，除此之外，块级元素比较霸道，它独自占据一行高度（float浮动除外），一般可以作为其他容器使用，可容纳块级元素和行内元素。块级元素有以下特点：
1.每个块级元素都是独自占一行。 2.元素的高度、宽度、行高和边距都是可以设置的。 3.元素的宽度如果不设置的话，默认为父元素的宽度（父元素宽度100%）。
行内级元素 inline
行内元素不可以设置宽（width）和高（height），但可以与其他行内元素位于同一行，行内元素内一般不可以包含块级元素。行内元素的高度一般由元素内部的字体大小决定，宽度由内容的长度控制。行内元素有以下特点：
1.每一个行内元素可以和别的行内元素共享一行，相邻的行内元素会排列在同一行里，直到一行排不下了，才会换行。 2.行内元素的高度、宽度、行高及顶部和底部边距不可设置。 3.元素的宽度就是它包含的文字或图片的宽度，不可改变。
行内块级元素 inline-block
行内块级元素，它既具有块级元素的特点，也有行内元素的特点，它可以自由设置元素宽度和高度，也可以在一行中放置多个行内块级元素。比如input、img就是行内块级元素，它可以设置高宽以及一行多个。具体特点如下：
1.和其他行内或行内块级元素元素放置在同一行上； 2.元素的高度、宽度、行高以及顶和底边距都可设置。
元素类型转换display
display：block ，定义元素为块级元素 display : inline ，定义元素为行内元素 display：inline-block，定义元素为行内块级元素。
总结 不管块级元素还是行内元素，区别主要是三个方面:一是排列方式，二是宽高边距设置，三是默认宽度。 1.块级元素会独占一行，而内联元素和内联块元素则会在一行内显示。 2.块级元素和内联块元素可以设置 width、height 属性，而内联元素设置无效。 3.块级元素的 width 默认为100%，而内联元素则是根据其自身的内容或子元素来决定其宽度。而行内块级元素又同时拥有块级元素和行内元素的特点。
