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 。酷!