1.布局流 block是独占一行,而inline-block是与行内元素水平排列
2.默认宽度 block是撑满父容器宽度(width:100%) inline-block是由内容决定
示例如下:
js
<style>
.block-box{
height:300px;
background-color:red;
display:block;
}
.inline-block-box{
height:300px;
background-color:red;
display:inline-block;
}
</style>
<body>
<div class="block-box">Block 1</div>
<div class="inline-block-box">inline-block-box</div>
</body>
我们看下效果:

当然block也是可以设置它的宽度的。