web開發是用px還是rem
- 清浅原創
- 2019-04-09 10:19:503072瀏覽
px是用來固定尺寸的單位，多用於pc端頁面；而rem是一個相對於html根元素的單位，適合用於簡單的行動端頁面。在專案中還是要根據特定開發要求來選擇最適合的長度單位
在前端開發中，CSS中的長度單位是必不可少的，因為在CSS中的眾多屬性都需要依賴長度單位來顯示各種頁面元素及效果，接下來將在文章中為大家具體介紹兩種常用的長度單位rem和px,希望對大家有所幫助
#【推薦課程：CSS教學】
px
## px意為像素，它是相對於顯示器螢幕解析度而言。用px設定字體大小時，效果會比較穩定和精確。但用px也存在一些問題例如：IE瀏覽器無法調整那些使用px作為單位的字體大小，因此會造成因設備螢幕大小使得頁面效果改變
remrem是CSS3新增的一個相對單位，當使用rem為元素設定字體大小時，它會相對於HTML根元素是。透過rem，我們只需要修改根元素就可以成比例的調整所有字體的大小，同時也可以避免字體大小逐層複合的連鎖反應。
範例：
!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <!-- 用px单位--> px:<p style="font-size:14px; text-indent:28px"> 我是一段文字，我是一段文字，我是一段文字，我是一段文字，我是一段文字，我是一段文字，我是一段文字</p> <!-- 用rem单位，当前html的字体大小是16px--> rem:<p style="font-size:14px; text-indent:1.75rem"> 我是一段文字，我是一段文字，我是一段文字，我是一段文字，我是一段文字，我是一段文字，我是一段文字</p> </body> </html>效果圖如下：
#px與rem如何選擇
px適合用來固定尺寸，多用於pc端頁面，而rem更適合用於行動裝置頁面
rem實現的是在不同尺寸的螢幕上顯示大小一樣的內容，但使用者往往需要的是頁面效果隨著螢幕的大小改變而改變，所以rem在複雜的頁面上不佔任何優勢
所以在開發中，我們還是要根據實際開發情況來決定，例如有的專案只需要在pc端展示我們就可以使用px作為長度單位，有的專案需要做響應式開發就要看具體情況來決定了
#總結：以上就是本篇文章的全部內容了，希望對大家有幫助。
本文參考###：https://www.html.cn/book/css/values/length/index.htm####以上是web開發是用px還是rem的詳細內容。更多資訊請關注PHP中文網其他相關文章！
陳述：
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn