标准文档流:

                 指元素根据块级元素和行内元素的特性,按照从上到下,从左到右的顺序依次排列,这种方式是默认的排序方式

 

 

 

 

 

一.块级元素和内联元素

块级元素内容独占一行,内联元素内容自动拼接

dispaly属性：块级元素与内联元素的相互转换

              block:   块级元素的默认值,将内联元素转换成块级元素

              inline：   内联元素的默认值,将内联元素转换为块级元素

              inlin-block：   内联元素和块级元素特性都存在

              none：隐藏元素,隐藏后位置不会被占用

 

二.浮动

           float：设置元素的浮动

                      left     ：左浮动

                      right   ：右浮动

                      none  ：默认,不浮动

 

 

 三.防止父级元素塌陷的方法

 

         浮动元素后面空div

                          简单,空div会造成1HTML代码冗余

         设置父级元素的高度

                          简单,元素固定高度会降低扩张性

           父级添加overflow属性

                            简单,下拉列表的场景不能用(经常使用)

            父级添加伪类after

                            写法比上面稍微复杂一点,但是没有副作用,推荐使用