溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
今天就跟大家聊聊有關CSS中的三種長度單位，可能很多人都不太了解，為了讓大家更加了解，小編給大家總結了以下內容，希望大家根據這篇文章可以有所收獲。
px
px是像素值，是一個固定的長度，比如我們的米，厘米一樣。
為什么我們需要相對長度rem em等？
固定長度已經不能滿足我們現在的需求了。
舉例：比如我們在縮小我們屏幕的時候，我們不僅僅是需要縮小我們的盒子的寬高，我們還想要讓我們字體大小也隨之縮小，這樣用戶體驗會更好一點。
rem 與 px 的計算關系
rem的值是px的倍數
默認情況下font-size = 16px,那么1rem = 16px
rem 如何修改與px的相對計算關系
我們可以在并且只能在html標簽（因為html節點是根節點，就是rem里面的r：root）里面修改font-size : 32px， 從而1rem = 32px
代碼
<p class="p-rem">rem</p>
/* rem的用法 */
html{
font-size:16px; // 1rem = 16px
}
.p-rem{
width: 10rem; // 10rem = 10 x 16 = 160px
height: 10rem; // 10rem = 10 x 16 = 160px
font-size: 1rem; // 1rem = 16px
background-color: #a58778;
}em 與 px 的計算關系
em的值是px的倍數
默認情況下font-size = 16px,那么1em = 16px
em 如何修改與px的相對計算關系
我們可以在自己元素上面修改font-size : 32px， 從而1em = 32px
如果自己元素上面沒有設置font-size, 我們也可以在父元素上面設置font-size，從而來影響自己元素（孩子元素）使用的em的值。
看完上述內容，你們對CSS中的長度單位有進一步的了解嗎？如果還想了解更多相關內容，歡迎關注億速云行業資訊頻道，感謝各位的閱讀。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
