You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
<html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> html { font-size: 10px; } div { /* rem 等于根元素 html 设置为准，这里的 1rem 等于 16px */ font-size: 1rem; }
</style></head><body> <div> <span>123</span> </div></body><script> var c = () => { // 获取当前设备宽度 let w = document.documentElement.clientWidth // 设置字号，默认为字号为20, 以 320 的宽度作为设备依据（可选），如果计算出当前设备的字号大于40，就以40字号显示 let n = (20*(w / 320 ) > 40 ? 40 + "px" : 20*(w / 320 ) + "px") // 当计算好后，赋值给 fontSize document.documentElement.style.fontSize = n } // 设置为初始化的效果 window.addEventListener("load", c) // load 是重新加载计算 // 当屏幕尺寸改变后的效果 window.addEventListener("resize", c) // resize 属性规定是否可由用户调整元素的尺寸大小</script></html>
|
