CSS显示模块分为内部显示类型和外部显示类型，内部显示类型是定义子元素如何参与内部布局，外部显示类型定义了父元素如何参与外部整个文档流的布局，所以
inline-> inline-inline
block-> block-block
inline-block-> inline-block

他们的区别是分两块的，也就是内外部显示类型，参与文档布局的内外区别。

inline： 行内元素，元素不独占一行，不可以修改宽高
block： 块级元素，元素独占一行，可以修改宽高
inline-block： 行内块级元素，元素不独占一行，并且可以修改宽高

每个元素都两个盒子，外在盒子和内在盒子。外在盒子负责元素是可以一行显示，还是只能换行显示；内在盒子负责宽高、内容呈现什么的。
外在盒子-内在盒子
from 《css世界》

inline： 行内元素，元素独占一行，不可以修改宽高
block： 块级元素，元素不独占一行，可以修改宽高
inline-block： 行内块级元素，元素不独占一行，并且可以修改宽高

inline： 行内元素，元素不独占一行，不可以修改宽高
block： 块级元素，元素独占一行，可以修改宽高
inline-block： 行内块级元素，元素不独占一行，并且可以修改宽高