一，标准流（默认状态，元素盒按照文档中出现的顺序排列）
块级元素--垂直排版 display:block;
单独一行，可以设置宽高，宽度默认和父元素宽度一致
一般结构性标记都为块级元素，如div，h，p，ul等
行内元素--水平排版 display:inline-block;
与其他元素并排一行，不能设置宽高，宽度默认为内容的宽度
一般描述性标记都为行内元素，如span，a，img等
二，浮动流--水平排版
左浮动--float:left;
右浮动--float:right;
元素可以左右浮动，当该元素外边框边缘遇到另一个元素的外边框时，该元素有确定位置
浮动流的包含框宽度不够时，元素向下移动，两个浮动元素高度不同时，可能被卡住
三，定位流（通过top，bottom，left，right调整位置）
相对定位--position:relative;
top，bottom，left，right是相对于该元素在标准流中的位置移动的距离，不管是否移动，元素仍占据其在标准流中的位置，显示上可能覆盖其他元素
绝对定位--position:absolute;
top，bottom，left，right是相对于距离最近的已定位的父元素移动的距离，可以覆盖页面上其他元素，元素在标准流中不占据位置，不影响标准流中元素的位置
绝对定位有一个属性z-index，z-index越大显示在越上面
一般情况下，父元素采用相对定位，子元素采用绝对定位。以相对定位的父元素作为子元素绝对定位的参照物。
当然这种情况并不是绝对的，父元素也可以设置成absolute，子元素要找的是非static定位的父元素。
固定定位--positon:fixed;