PX（固定單位）
單位名稱為像素，絕對長度單位，像素px是相對於顯示器屏幕分辨率而言的。像素的使用性特別廣。使用px定義文字，無論用戶怎么設置，都不會改變大小。
em（是所在標簽的字體大小，多少em就是代表多少倍）
單位名稱為相對長度單位。它沒有一個固定數值，支持小數點后三位數，相對於當前對象內文本的字體尺寸。如當前對行內文本的字體尺寸未被人為設置，則相對於瀏覽器的默認字體尺寸。需要注意的是：若父級單位用了em，且設置了文本大小，這父級大小會隨文本大小而改變，會繼承父級元素的字體大小。
rem（相對於根元素【html】字體大小的倍數）
適用場景：移動端開發
是CSS3新增的一個相對單位（root em，根em），是相對HTML根元素。通過它既可以做到只修改根元素就可以成比例地調整所有字體大小，又可以避免字體大小逐層復合的連鎖反應。
vh（多少vh就取多少百分比）（一般情況下運用於寬和高）
1vh=視口高度的1%
vw
1vw=視口寬度的1%
1、定位體系的意義
CSS2.1中，一個框(box，就是元素形成的方塊等)可以根據三種定位體系布局。CSS2.1中的定位體系幫助作者使他們的文檔更容易理解，並不需要使用標記的手段（如，不可見的圖片）達到布局的效果。 格式化上下文決定了可視化格式模型中框的形式，定位體系布局決定了這些框在頁面中如何布局。
2、定位體系的分類
元素在布局時，根據3種定位體系定位。分別是，常規流、浮動和絕對定位。
3、常規流：( Normal flow )
常規流，是對 normal flow的直譯。 流者，動也。偏旁是三點水，說明，跟水有關系，水的流動是連續不間斷的，也是有先后順序的。在這里，我們把它當作可以流動的(位置可變)，有先后順序(元素順序加載)的體系。在文檔加載的時候，好像流水似的，一點點的漫過整個畫布。還有一種說法是，瀏覽器在解析HTML CSS JS 的時候的一個流式的過程，從html起始標簽開始 到html結束標簽截止。
之所以是常規，是因為，這是相對於后面的浮動和定位的一個概念，浮動和定位元素都脫離了當前的常規流。 在 CSS2.1中，常規流包括塊框(block boxes)的塊格式化(blok formatting 后續會講到)，行內框(inline boxes)的行內格式化(inline formatting 后續會講到)，塊框或行內框的相對定位，以及插入框的定位。
在 CSS 中，元素定義的環境有兩種，一種是塊格式化上下文( Block formatting context )，另一種是行內格式化上下文( Inline formatting context )。 這兩種上下文定義了在 CSS 中元素所處的環境，格式化則表明了在這個環境中，元素處於此環境中應當被初始化，即在常規流中的框，都屬於一個格式化的上下文中等。
4、浮動（Floats）
浮動，顧名思義，相對於常規流來講，它漂浮在常規流的上方。因為它不再處於文檔流中，所以它不占據空間。
在浮動模型中，一個框(box)首先根據常規流布局，再將它從流中取出並盡可能地向左或向右偏移。內容可以沿浮動區的側面排列。因為它首先要根據常規布局后才偏移，所以效率較常規流低。 用 ‘float’ 特性聲明浮動，特性值可以是：”none”、”left”、”right”。
5、絕對定位（Absolute positioning）
在絕對定位模型中，一個框(box)整個地從常規流向中脫離（它對后續的兄弟元素沒有影響），並根據它的包含塊來分配其位置。
6、選擇定位方案
‘float’和’position’特性決定了使用哪種CSS2.1定位算法來計算框的位置。 不同的position選擇不同的定位算法。
| 屬性 | 示例 | 描述 |
|---|---|---|
| color | color：red | 設置元素內容的顏色 |
| text-align | text-align：center | 設置元素內容的對齊方式 |
| font-size | font-size：28px | 設置元素內容的文字大小 |
| font-weight | font-weight：bold | 設置元素內容的文字粗細 |
| background-color | background-color：red | 設置元素的背景顏色 |
7.層疊
1.聲明沖突：當相同屬性名不同屬性值應用於同一個元素，就是產生聲明沖突。此時瀏覽器就會自動觸發層疊機制。
-
層疊的過程
1.比較優先級：與來源和重要性（!important）【書寫要放在想要賦值的元素的分號之前】相關
2.比較特殊性
每一個聲明都有一個特殊性（specificity）。一個聲明的特殊性，取決於規則適用范圍的大小，規則適用范圍越大，特殊性越低，適用范圍越小，特殊性越高（行內樣式>ID選擇器>類選擇器，偽類選擇器>元素選擇器>通配符選擇器）
a：若聲明是行內樣式。0則為1，否則為0（統計每一個的個數）
b：規則中ID選擇器的個數
c：規則中類選擇器，偽類選擇器和屬性選擇器的個數
d：規則中元素選擇器，偽元素選擇器的個數
3.比較源次序
誰寫在后面誰就有更高的優先級