1. CSS 框模型
塊元素指的是段落棚蓄、單元格堕扶，把多個段落組合起來形成一個分區(qū)，也是塊元素梭依。
框模型也叫盒子模型稍算，把 HTML 里面的塊元素看做盒子，考慮盒子和外面東西之間的關(guān)系役拴。
對于一個塊元素糊探，CSS 盒子模型是說我們在最里面的是那個元素本身。我們可以規(guī)定高度和寬度河闰，元素外面邊框的線型科平、寬度和顏色、框和里面的元素之間的距離（內(nèi)邊距 padding姜性，邊框之內(nèi)是背景 background 起作用的地方）瞪慧、邊框的外面和鄰接元素的關(guān)系（鄰接間距 margin）。
我們有一系列參數(shù)可以設(shè)置部念，可以通過框模型進行相應(yīng)屬性的設(shè)置弃酌。
padding 內(nèi)邊距
padding:20; 元素和四個方向邊框距離都是 20 個像素氨菇。
padding-top:10; 其他方向為默認的最小值。
padding:10 15 20 25; 上右下左妓湘，順時針查蓉。
border 邊框（參照前一章）。
margin 鄰接間距
<p style="margin:50px;"> 和周圍所有東西隔開 50 像素榜贴。
<p style="margin:10px 50px 50px 10px;"> 上右下左
當(dāng)兩個相鄰元素它們的外邊距分別給出豌研，取兩者之間較大的距離。
2. CSS 定位
HTML 是一種流式的排版格式竣灌，意味著所有的東西都是從左上角流到右下角。作為一種文本的排版語言及汉，要做橫向的填行。
CSS 提供了另外一種手段使得我們有可能去指定某一個塊狀元素在整個頁面當(dāng)中或者在它所相對的某一個地方的一個位置，突破了 HTML 作為一種流式排版語言的限制类溢。
<div></div> 是一種重要的塊狀元素。里面可以放很多段落，被認為是一個分區(qū)纺涤，可對它進行定位撩炊。在分區(qū)里的段落也可以做定位。<p> 中可以有 <span></span>指的是在行內(nèi)的一段呛踊。
過去用 div 做定位汪厨，到 HTML5 增加一些標記用于表達常用的分區(qū)。<head>（頭）<foot>（頁腳）<side>（側(cè)面）<article>（正文內(nèi)容）。地位與 div 相同，預(yù)先起了名字的 div 谦趣。
在 CSS 定位機制里頭有幾種定位手段。定位的基本思想是允許你定義元素的框相對于其正常位置（或父元素舰绘、另外一個元素除盏、整個瀏覽器窗口）應(yīng)該出現(xiàn)的位置窃祝》嘈。可以有很豐富的手段給出元素的定位。
三種定位機制：普通流（默認）流济、浮動（float绳瘟，浮動在瀏覽器上）雕憔、絕對定位（absolute fixed）
塊級框從上到下一個接一個地排列，框之間的垂直距離是由框的垂直外邊距（margin）計算出來的糖声，它在一行中水平位置使用水平內(nèi)邊距斤彼、邊框和外邊距（padding,border,margin）決定元素和其它元素的距離，形成行框蘸泻。在一行的所有元素排列起來形成行框琉苇。行框的高度是這一行所有元素的最大高度。
CSS 定位用的屬性叫做 position:static / relative / absolute / fixed
static ? 元素框正常生成矩形框悦施，行框放在父元素中并扇。（默認）
relative ? 在原來位置基礎(chǔ)上變動，偏移某一個距離歼争，保持形狀拜马，原來位置保留。
absolute ? 絕對定位沐绒，原來位置不保留俩莽。
fixed ? 相當(dāng)于 absolute 根據(jù)瀏覽器窗口決定位置。
相對定位
<p style="position:relative;left=-20px;botton:20px;">在原來位置上左邊減少20px,原來位置底部往上移動了20px.完全不顧 margin 的問題乔遮。
相對位置調(diào)整時扮超，不管周圍元素，原來位置保留不動蹋肮。
絕對定位
<p style="position:absolute;left:-20px;bottom:-20px;">
絕對意味著要把元素從原來的流式定位的位置拿走出刷。從里往外走第一個能定位的元素開始作為定位基準。（body 不能做定位）
absolute 定位要根據(jù)它所在的上一層（已定位）的相對位置坯辩，若沒任何東西定過位就是整個瀏覽器相對位置馁龟。
浮動定位
<img src="mama.jpg;" width=200 style="float:right;"> 圖片永遠貼在瀏覽器右邊。
