前端概念的一些理解

1. static，無定位的元素，塊級元素從上到下，內聯元素從左到右排列。
2. 相對定位置元素，在沒有設置top等定位屬性時，按照文檔流進行排列。設置top等屬性之後，會相對自身原來的位置進行定位。
3. 絕對定位元素，會脫離文檔流，不會影響到文檔流中的元素。會覆蓋掉無定位的元素（正常文檔流的元素）。
4. 浮動元素，也會脫離文檔流，不會影響文檔流其他元素的位置。浮動元素會在z軸推進一層，可覆蓋掉文檔流中的元素，但是文檔流文字會呈現出環繞效果。也就是說文字並不會被覆蓋。
5. 所有元素都是一個盒子，頁面是按照一個一個盒子從上到下（塊元素），從左到右（內聯元素）進行生成的。所有的盒子都可設置margin，padding等屬性(驗證內聯元素)。內聯元素不能設置height，width，它的寬高由內容決定。
6. ie盒子和常規盒子。盒子包括margin，border，padding，content。在 標準盒子模型中，width 和 height 指的是內容區域的寬度和高度。增加內邊距、邊框和外邊距不會影響內容區域的尺寸，但是會增加元素框的總尺寸。IE盒子模型中，width 和 height 指的是內容區域+border+padding的寬度和高度。
7. display none 和 visiblity hidden，前者不佔用空間，不能獲得元素的寬高，後者佔用空間。
8. 元素有原本的填充尺寸以及實際尺寸width,height。static和relative塊元素的填充尺寸寬度爲100%，也就是一行，沒有高度。當元素有高度之後(可以設置高度)，填充尺寸爲高度×一行的寬度。如果這時設置width屬性，元素的寬高就是填充尺寸不一致。填充尺寸是元素在文檔流中佔用的空間，而元素表現出來的寬高是實際的寬高。這是通過設置margin auto，可以讓元素根據填充尺寸的剩餘空間進行自動適應。
9. 絕對定位元素，在沒有設置寬高時，填充尺寸爲0*0，但是，可以設置top0，bottom0讓元素的填充尺寸變爲父級定位元素的高度，right0,和left0則讓填充寬度變爲父定位的寬度，這時絕對定位元素的填充尺寸就爲父定位元素的寬高，設置margin，auto之後，可達到垂直水平居中效果。
10. 填充尺寸和實際尺寸。填充尺寸是元素應該有的尺寸，實際尺寸是通過height和width強制改變之後的尺寸。在沒有強制改變之前，元素以填充尺寸呈現。
11. 讓元素不可見有很多方式，設置絕對定位元素的zindex，設置父元素overflow，隱藏子元素超出父元素尺寸的部分，或者讓元素定位到瀏覽器視窗之外。當沒有設置overflow爲hidden時，子元素超出父元素寬高的部分依舊可見。