css - 显示 : inline on MDN CSS

Question

我在 this link 上读到关于 css 的 display ，我遇到这条线的地方:

display : inline | The element generates one or more inline element boxes.

这是什么意思？正在谈论哪些盒子？

Answer 1

我想一张图就能说明一切。

http://jsfiddle.net/3PGLd/2/

HTML

<div>
<div class="inline">HI</div>
<div class="inline">HELLO</div>
<div class="inline">HOWDY</div>
</div>
<div>
<div class="block">BYE</div>
<div class="block">GOODBYE</div>
<div class="block">TATA</div>
</div>

CSS

.inline{
display: inline;
border: 1px solid;
}
.block {
display: block;
border: 1px solid red;
}

inline 允许更多元素出现在同一水平线上。 block 挡住整个水平区域。