HTMI CSS常规流和浮动

块盒在常规流的位置：

盒子在包含块的垂直方向上依次摆放：依次摆放：按照HTML元素的书写顺序，

才能跟上到下摆放 ，盒子在包含块中占据的尺寸是整个盒子的尺寸，垂直方向上，

若两个外边距相邻，则进行合并 ，水平方向：水平方向上的外边距不会合并 。

 

外边距相邻：两个外边距之间没有border，padding，content

合并：均为正数最大，均为负数最小，一正以负则相加

水平方向上：常规流盒子 水平方向上的尺寸，必须等于包含块的宽度

让区块水平居中：1.给固定宽
                          2.左右margin设置为auto

垂直方向：1.margin为auto：0px
                2.height为auto：适应内容的高度

 

 

浮动的盒子位置：1.左浮动的盒子向上向左排列
                           2.右浮动的盒子向上向右排列
                           3.浮动盒子的顶边不得高于上一个盒子的顶边
                           4.若剩余空间无法放下浮动的盒子，则该盒子向下移动，直到具备足够的空间能够容纳盒子，然后再向左或向右移动

 

 

浮动：定义：当元素的float属性取值为left或right时，元素属于浮动定位

float：1.不可继承
          2.默认值：none
          3.取值：none/left/right

 

当常规流遇上浮动流：1.浮动盒子在摆放时，要避开常规流盒子

2.常规流盒子在摆放时，无视浮动盒子

 

转载于:https://www.cnblogs.com/fen0309/p/9352055.html