一、盒子模型：
整體的寬=margin-left（right）+padding-left（right）+border+content
整體的高=margin-top（bottom）+padding-top（bottom）+border+content
二、頁面布局：
（1）標準流：按照原先格式排版塊兒元素等一些格式，所有塊兒都是按照豎排排列，自佔一排。
（2）浮動流：給div標籤加上float屬性，是指按照屬性來排列。若想讓所給的塊兒元素按照橫行排列，需要給每個div元素均新增float：left（right）屬性。
（3）每個物件都可以呼叫多種樣式，樣式之間用空格鍵來進行分開即可。
（4）要是塊級元素居中，使用margin：0 auto；
要是行內元素居中，給父元素使用text-align：center；
（5）建立頁面前可以建立乙個通用頁面，清除margin，padding等值。其中list-style：none；屬性可以使列表中的圓圈，方塊兒等標誌去掉。clear：both可以清除浮動屬性。當行高等於頁面塊狀元素的高時，其中的內容垂直居中。使用display：inline-block（block）屬性可以讓行內元素和塊元素進行轉換。ctrl+shift+/=注釋（其中的內容並不在頁面中顯示），在html中：代表注釋，在css中：/* */代表注釋。border-radius屬性可以設定圓角效果。cursor：pointed可以在滑鼠停留時由箭頭變成手狀。input-outline：none可以使所有由input定義的框框除去除在選中時的藍色邊框。
（6）頁面中的定位：position屬性，relative（相對定位：不加限定的時候以該標籤原先所在的位置為參考）/absolute（絕對定位：以父元素位置為參考）/fixed（固定定位：定在頁面中的位置保持不動）。
如果想要進行移動，要給父元素定義position：relative；（此時不用定義top等值）
position與top，bottom，left，right在一起使用
若定位與浮動在一起使用時，浮動效果消失。
（7）">"連線的元素代表父子關係，只適用於兩代，而使用空格的則代表該元素下所有相同的標籤。
（8）在下拉表單中，要想讓滑鼠停留時再出現其中的內容時，需要在其中新增display：none（系統預設隱藏，不占用結構，等於此**被注釋）而使用display：block可以使內容顯示出來。
（9）hover屬性可以使用在很多標籤上,用於定義滑鼠停留時的樣式。
（10）
顯示屬性
display:
屬性值：none:隱藏
block:塊級顯示
inline：行級顯示
（11）
浮動屬性
float:
屬性值：left right
clear:清除浮動 left right both
缺點： (1)影響相鄰元素不能正常顯示。(2)影響父元素不能正常顯示。
HTML 頁面布局
2.10頁面布局概述 頁面布局概述 1 table布局 通過table元素將頁面空間劃分成若干個單元格，將文字或等元素放入單元格中，隱藏 的邊框，從而實現布局。這種布局方式也叫傳統布局，目前主要使用在edm 廣告郵件中的頁面 中，主流的布局方式不用這種。2 html css布局 div css 主要...
html頁面布局
display 元素的顯示方式 black 塊元素 inline block 行內塊元素 內聯塊元素 none 無 隱藏 不單單是視覺上的，頁面布局中也徹底消失，不佔位置 塊元素 獨佔一行，可以設定寬高以及內外邊距。行元素 只佔內容大小的區域，不可以設定寬高和內外邊距。塊元素具備盒模型的屬性。行元素...
html頁面布局 定位
相對定位 1 相對的是自身原有的位置 2 相對定位移動後，會保留原有位置 可以使用定位占用，但普通寫法時，無法占用 3 不會影響文件流 position relative 開啟該元素的定位 具體的位置 left top 父級 main 子級 box絕對定位 1 脫離當前文件流，使元素 飄 起來，父級...