首先，px是最常用的單位，一般用於PC端開發，而rem能等比例適配所有屏幕，通常用於響應手機端。
rem是相對於根部而言，em相對於父級元素而言，1rem=根部元素所定義的大小。任意瀏覽器的默認字體高都是16px。所有未經調整的瀏覽器都符合: 1em=16px。若用em單位，爲了在代碼編寫過程中，操作簡單，通常做一個轉換，在此不做具體說明。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
html{font-size:40px;}
#remrem{height:10rem;width:20rem;background:red;font-size:2rem;}
#emem{height:200px;width:400px;background:blue;font-size:10px;}
#emem p{font-size:3em;}
#abc p{font-size:2em;}
</style>
</head>
<body>
<p>好好學習，天天向上font-size:40px</p>
<div id="remrem">
<p>好好學習，天天向上font-size:2rem;</p>
</div>
<div id="emem">
<p>好好學習，天天向上（父級元素）font-size:3em;</p>
<div id="abc">
<p>好好學習，天天向上font-size:2em;</p>
</div>
</div>
</body>
</html>
