rem 是相对于根元素(html)的相对长度单位,常用于响应式布局
px是绝对单位
若根元素html 设置值为font-size:100px ,则1rem为100px, 则1rem = 100px 0.1rem = 10px
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
// 允许拖拽
<div draggable="true">
123
</div>
<p style="font-size: 0.1rem">1</p>
<p style="font-size: 0.5rem">2</p>
<p>3</p>
<style>
// rem相对于根元素的长度单位
html {
font-size: 100px;
}
</style>
<script>
</script>
</body>
</html>