我觉得css有必要对这个概念进行聊聊。display:inline、block、inline-block的区别
inline：就是内联样式，什么是内联样式呢，来看一个demo
运行结果是上面那样子，但是如果<li>属性去掉style中的dispaly：inline会是什么样子呢？
请看下面的代码
也就是说所谓的内联样式不过就是： 上面这种效果，具体是上面感觉你自己领会领会
block：块 这个比较好理解，就是说他的元素是以块的形式显示的、来一个demo
1 2 3 4 23 24 25 2632 33
Note: If a !DOCTYPE is not specified, floating items can produce unexpected results.
34 35A background color is added to the links to show the link area. The whole link area is clickable, not just the text.
36 37Note: overflow:hidden is added to the ul element to prevent li elements from going outside of the list.
38 39 40 41显示效果如下：
加入去掉这个block样式的话，会是什么样子的呢？
1 2 3 4 18 19 20 2127 28
Note: If a !DOCTYPE is not specified, floating items can produce unexpected results.
29 30A background color is added to the links to show the link area. The whole link area is clickable, not just the text.
31 32Note: overflow:hidden is added to the ul element to prevent li elements from going outside of the list.
33 34 35 36显示效果如下：
好，最后一种
display:inline-block将对象呈递为内联对象，但是对象的内容作为块对象呈递。旁边的内联对象会被呈递在同一行内，允许空格。
1 2 3 4 5display:inline、block、inline-block的区别 6 7 17 18div display:block19div display:inline20div display:inline-block21 span display:inline22 span display:block23 a display:block24vertical-align:middle25 26
效果如下图所示：
备注:
①<div>, <p>, <h1>, <form>, <ul> 和 <li>默认是块元素的例子。
②<span>, <a>, <label>, <input>, <img>, <strong> 和<em>默认是inline元素的例子。
1. Block和inline元素对比所有的HTML元素都属于block和inline之一。block元素的特点是：总是在新行上开始；高度，行高以及顶和底边距都可控制；宽度缺省是它的容器的100%，除非设定一个宽度,,
,