关于div+css布局值得注意的地方

注意项

我们知道,如果想要两个 div(即块级元素)挨着一起排列,可以将其设置为inline-block(行内-块元素)。

不过要注意两个div内的内容的对齐方式将是垂直中间对齐,所以这时候就需要使用float浮动。

使用float的时候有个问题:当一个元素盒子被浮动后,下面的元素会自动堆叠处理,导致元素不可见。

这时我们可以使用clear属性。

多次遇到的坑

当我们使用div+css布局的时候,即使把两个div盒子声明为inline-block,仍然无法使其并排显示。

那么问题就出在于没有声明两个div盒子的宽度。因为没有声明,所以系统会认为div盒子的宽度为100%。

因此要给div盒子声明宽度,并且并排的div盒子的宽度加起来需要小于父级元素的宽度。

 

posted @ 2017-04-03 02:41  汕大小吴  阅读(337)  评论(0编辑  收藏  举报