float
是一种选择,但是使用 inline-block
会更简单。让我们看下使用这两种方法的例子:
.box { float: left; width: 200px; height: 100px; margin: 1em; } .after-box { clear: left; }
DIV 在浮动!
DIV 在浮动!
DIV 在浮动!
DIV 在浮动!
DIV 在浮动!
DIV 在浮动!
DIV 在浮动!
DIV 在浮动!
DIV 在浮动!
DIV 在浮动!
我在使用 clear
,所以我不会浮动到上面那堆盒子的旁边。
.box2 { display: inline-block; width: 200px; height: 100px; margin: 1em; }
我是一个行内块!
</div>我是一个行内块!
</div>我是一个行内块!
</div>我是一个行内块!
</div>我是一个行内块!
</div>我是一个行内块!
</div>我是一个行内块!
</div>我是一个行内块!
</div>我是一个行内块!
</div>我是一个行内块!
</div>这次我可没有用 clear
。酷!