1.塊級元素：<div>,<p>,<h>,<hr>等標簽
總是從新的一行開始
高度，行高，內邊距，外邊距都是可以控制的
2.行級元素：<span>,<a>,<img>,<input>
和其他的元素在同一行
高度，行高，內邊距，外邊距都是不可以改變的
3.display的屬性值：none, block, inline, table ,inline-block
4.visibility的屬性值：visible，hidden，collapse
5.display="none" 與 visivility="hidden"的區別：
前者不占用頁面空間，后者是要占用頁面空間的
6.定位position的屬性：相關屬性top ,bottom,left,right 常用屬性值aotu
7. z-index的屬性：值越大，可表示顯示的內容的位置越高
8.overfolow的屬性：當元素的內容溢出區域的時發生的事情設置
屬性值：hidden , visible, scroll, auto
9.網頁布局分為：自然布局，浮動布局， 定位布局
10.當一個元素被定義為浮動顯示時，即定義為塊狀元素。並且該元素就會收縮自身體積為最小狀態。所以，應該有個好的習慣即把浮動元素設置高和寬。如果沒有設置，則元素會按照它所包含的內容大小來確定它的大小。
11.當元素浮動后，周邊的對象會自動環繞浮動元素周圍，形成一種環繞關系。
12.塊狀元素之間的外邊距會有重疊現象，但是浮動元素之間的外邊距不會發聲重疊現象。
13.浮動元素移動，上移：margin-top:-**; 下移：margin-botom:-*px,其他以此類推。
14.一般定位元素（絕對或是相對元素）都會覆蓋在文檔流對象之上。但是，select元素的窗口控件還不完全支持z-index
15.在css定位布局中，一般遵循“外部相對定位，內部絕對定位”
16.在body中設置min-width:760px,可以避免布局重疊現象。
17.浮動的元素會脫離普通流，是下一個元素會被覆蓋，
注意：當下一個元素被覆蓋的時候，應用使用clear屬性，來清空浮動效果，查看到布局效果
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>浮動布局</title> <style type="text/css"> body{ margin: 0 auto;width: 1000px;align-content: center;} #div-1{width: 1000px; height: 30px;background-color: slateblue;margin: 3px auto;} #div-2{width: 1000px;height: 40px;background-color: forestgreen;margin: 1px auto;} #div-3{width: 590px;height: 400px;background-color: darkgoldenrod;float: left;margin: 3px auto5;} #div-4{width: 400px;height: 400px;background-color: darkmagenta; float: right;} #div-5{width: 1000px;height: 40px;background-color: deeppink;clear: both;} </style> </head> <body> <div id="div-1"></div> <div id="div-2"></div> <div id="div-3"></div> <div id="div-4"></div> <div id="div-5"></div> </body> </html>