css的盒子布局

display/position

确定元素的显示类型

block/inline/inline-block

弹性盒子,本来就是并列的,指定宽度即可。

float:元素浮动,脱离文档流,但是不脱离文本流

float元素的特性:

对自身的影响:

1.形成块(BFC),他对自身都是有一定的宽高,也可以给他设置宽高。

2.位置会尽量靠上或者左右,如果他的宽度不够的时候它会往下掉。

对兄弟元素的影响:

1.上面贴非float元素

2.旁边贴float元素

3.不影响其他块级元素的位置

4.影响其他块级元素的内部文本。

对父级的影响

1.从布局上消失

2.高度塌陷

inline-block:

1.想文本一样排列block元素

2.没有清除浮动等问题

3.需要处理间隙

处理间隙的问题需要把父元素的字体的大小设置为零。

原文地址:https://www.cnblogs.com/qijiang123/p/13802412.html