REM是相對機關,是相對HTML根元素,子元素大小可以參照根标簽的資料。
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
*
{
margin: 0;
padding: 0;
}
.box
{
position: relative;
background-color: crimson;
width: 1rem;
height: 1rem;
}
</style>
<meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no,minimal-ui">
</head>
<body>
<div class="box"></div>
<script>
setRem();
function setRem()
{
var w = document.documentElement.clientWidth || document.body.clientWidth;
document.documentElement.style.fontSize = w / 414 * 100 + "px";
}
window.onresize = setRem;
</script>
</body>
</html>
有什麼問題歡迎留言！~~~~~~
![H5上傳圖檔上傳[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)