剛開始學習的小白，如有不足之處還請各位補充，感激涕零。
在html中有兩種方式布局<table>表格和<div>，個人劇的使用表格布局可以避免bug產生，並且表格布局相對來說要容易一些，只是布局方式比較繁瑣，用戶在加載時如果嵌套表格過多會造成加載過慢的現象，容易影響用戶體驗。
<div>布局呈現的效果多，可以與表格搭配使用，重點是在布局過程中注意<div>的特性，還有定位問題，剛開始使用它的時候，怎么也避免不了一些錯位，定位上的bug。
問題1：<div>的特性，默認占一整行，在布局過成功不可忽視的特性，需要配合浮動float來配合使用
問題2：使用float屬性可以讓多個<div>強制到一行，取消了它獨自享有一行的特性。例如 一個外層div嵌套了兩個div
#div{
width:100px;
height:100px;
}
#div1{
width:10px;
height:10px;
}
#div2{
width:10px;
height:10px;
}
那么他的呈現形勢是這樣的，
因為有占正行的特性，
這時候我們給兩個小div加上float屬性
}
#div1{
width:10px;
height:10px;
float:left;
}
#div2{
width:10px;
height:10px;
float:left;
}
就會呈現出這樣的效果，
right有浮動同理
再就是如果兩個浮動中的div寬度總和超出了父級div的寬度，那么后者浮動的會自動浮動到下一行，
因為這一行裝不下
問題3:<div>的position屬性，控制div的定位
有三種常用的屬性，絕對定位，相對定位，根據瀏覽器定位
絕對定位 position：absolute; 對於body而言 效果優先於普通的margin
寫法
#div{
width:100px;
height:100px;
position:absolute;
left:100px;
}
那么這個div接下來回根據body向右邊移動100像素。還有top，right，bottom同理
相對定位 position：relative; 相對於當前位置移動了了幾個像素，當前位置div1嵌套在div中，那么移動div1的位置就不是根據body了，而是在div中移動。
漂浮 position ：fixed; 相對於瀏覽器顯示頁面而言的的定位，此屬性設置好了一后，會永遠定在此位置，有滾動條也是如此。
最后：頁面布局之后，為了適應不同分辨率的用戶使用，防止分辨率變換造成的錯位等問題，可以在每一個大的內容div外邊套一個div高度不設置，寬度為100%，這樣就算里面的div高寬設死了也不會發生太大的錯位。