>[success] # css 單位 * css 長度單位分為兩個大類型**絕對長度單位**，**相對長度單位** * **絕對長度單位**，不受其他東西影響，屬于固定例如`px` * **相對長度單位** 受相對其他影響例如 **父元素的字體大小**，或者**視圖端口的大小**，相對單位好處可控制使文本或其他元素的大小與頁面上的其他內容相對應，常見的有`em`,`rem`,`vh`,`vw` | 相對單位 | 相對于 | | --- | --- | | em | 在 font-size 中使用是相對于父元素的字體大小，在其他屬性中使用是相對于自身的字體大小，如 width | | ex | 字符“x”的高度 | | ch | 數字“0”的寬度 | | rem | 根元素的字體大小 | | lh | 元素的line-height | | vw | 視窗寬度的1% | | vh | 視窗高度的1% | * 當設置100vw 時候即是視圖窗口百分百 >[success] # 設備像素和css像素 1. 設備像素指的是顯示器上的真實像素，每個像素的大小是屏幕固有的屬性，屏幕出廠以后就不會改變了； 2. 設備像素大小是不定的但實際開發中我們基本不關心設備的像素大小來設置css的像素原因是，操作系統為開發者進行抽象，提供了**邏輯像素**的概念，讓你的物理像素無論多大最后計算后他們的邏輯像素都是等同的，也就是在是2k、4k的顯示器設置100px *100px 大小塊他們大小都是相同的 3. CSS中我們經常使用的單位也是pixel，它在默認情況下等同于設備獨立像素（也就是邏輯像素）