前端大牛养成之路

Day12

2017-02-27  本文已影响3人  无关风月s

标准流:(流式布局)

从左到右,从上到下的依次布局

浮动的本质:解决文字和图片的排版问题。

总结:浮动的元素不会占据标准流的空间,但是会影响标准流的文字排版。

浮动特性:

1:浮动脱离标准流,不占位置,但会影响标准流,浮动分为左浮动和右浮动。

2:浮动的元素A排列位置,跟上一个块级元素有关系,如果上一个元素有浮动,则A元素顶部会和上一个元素的顶部对齐,如果上一个元素没有浮动,则A元素和上一个元素的底部对齐。

3:一个父盒子里面有子盒子,如果其中一个子级有浮动的,则其他子级都需要浮动,这样才能一行显示对齐。

4:浮动根据元素书写的位置来显示相应的浮动。

5:元素添加浮动后,如果没有设置宽高的话,元素会具有行内块元素的特性。元素的大小完全取决于定义的大小或者默认的内容多少。也就是具有了包裹性。

6:浮动具有破坏性,元素浮动后,破坏原来的正常布流局,造成内容塌陷。

父容器内容塌陷:(如何实习自适应包裹浮动子元素呢?)

解决方法:

A:overflow:hidden(超出的部分隐藏)

上一篇下一篇

猜你喜欢

热点阅读