问答详情
源自:2-5 悬浮层制作

看了别人的问题,还是不明白加了overflow:hidden的效果

.left dl dd{

display:block;

overflow:hidden;}

不加的话,第二行的dd内容会排列到dt底下

dt | dd dd dd dd

dd  dd dd dd  但是加了hidden就会变成这样

dt | dd dd dd dd

      dd dd dd dd

所谓的清楚浮动就是把父元素的float清除掉,所以第二行的dd才会排列的那里吗?

但是dt也没有固定的高度。。为啥会这样

提问者:pocketsun 2016-04-16 10:48

个回答

  • 传说中的小白龙
    2016-09-27 15:48:31

    来的比较晚。希望对慕友有帮助。

    我暂且将你的一群dd放到div里吧。

    1. 其实这里的overflow:hidden作用的确是清除浮动。说的再清楚一点就是:div计算高度时,将计算浮动元素的高——一群dd的高。

    2. 计算完毕后div作为一个块级元素已经有高有宽了,宽是直接等于父元素的内容宽度,高则是内容在里面排列超过宽度换行。

    3. dt是浮动元素,div里的a也是浮动的,div就被传送到了dt身边。最重要的一点,div在构建完毕后宽度是一定的,这导致了它的形状就只能是向下伸展的矩形。这就导致了,你的第二行dd排列到了那里,总不可能块状盒子是多边形吧。

    应该就是酱,自己的理解,有误还望指正。http://img.mukewang.com/57ea23c800013f6124341698.jpg

  • 帅锅
    2016-04-16 11:55:49

    溢出隐藏,主要就是防止dd里面的内容溢出二造成显示的错乱