HTML5学习_day05(1)--html浮动之文档布局

文档布局的4种方式：

        1.流式布局(自然布局)

        特点：没有任何修饰(没有定位float 定位 弹性)的布局，也就是元素在排版过程中，元素从上到下，从左到右的流式排列，遇块(块级元素)换行等。

         2.浮动布局(float)
        特点:给元素设置float属性后,脱离文档流，进行左右浮动，紧贴着父级框的左右框。此浮动元素流出来的位置，由后续非浮动元素进行填充。(例如:图片文字围绕 占用原来的空间 )

        3.定位布局(position)
        特点：定位分为相对定位，绝对定位，固定定位，也就是一个元素设置了定位属性，我们就可以通过left，top,right,bottom四个属性来去顶元素的排版位置。

        4.弹性布局(flex)

        特点：它使css3提出来的一种新的布局方式，该布局的目的是提供一种更加高效的方式来对容器中的条目进行布局，对齐和分配空间。