关于inline和inline-box的区别

inline是内联元素

inline-block是把对象呈现为内联对象，但是对象的内容作为块来呈现。

这样说可能有点难理解，下面做个小小的实验帮助理解啦。

下面用一个大的div来包裹住三个小的div，对于这三个小的div采取默认的display样式：

为每个小的div都设置为inline样式，如下：

从上面可以看出里面那三个小的div都变成inline元素了，但是它们原来的width和height也消失不见了。因为无法给inline元素指定尺寸。

 

下面再看看如果把那三个小的div都设置成inline-block的效果：

看到上面的效果了吧，那三个小的div不仅呈现为inline，而且它们的内容是呈现为块的，也就是width和height没有失效。