display:inline-block;display:block;display:inline

重要：

display:inline 转化成内联元素，不换行；

display:block转换成块元素，换行；

display:inline-block内联块元素，既不换行又可以使用块元素所拥有的属性，类似于块元素加了浮动效果，但低版本浏览器对这个不支持

 

 

Display:inline-block

将对象呈现为内联对象，但是对象的内容作为块对象呈现，旁边的内联对象会被呈现在同一行内。

例子：

<a class="none-pic" href="#" ></a> 此时，a设置长宽都不起作用，但是使用了display：inline-block后，内容作为块对象将外侧的a撑开，并且，旁边的“上传电子证照”也是行内元素。

 

说明：diplay：inline-block可以让内联元素有了长宽的作用，例如上例中，width,line-height,height等都起作用了，

但是margin:auto没起作用，主要是因为使用inline-block的对象是依然是行级元素，只是内容是块级元素，所以margin不起作用。

  如果使用block则将整个元素作为块级元素，此时，margin就起作用了。