移动网页,自适应大小
2023年09月02日 | 分类: js | 评论: 0 | 浏览: 486
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>自适应大小</title> <script> function scaleWidth() { var optimalLineLength = "50em"; var extraAccounting = "12em"; var minimumTextHeight = "8px"; var windowWidth = document.body.clientWidth; var optimalSize = windowWidth / (parseInt(optimalLineLength) + parseInt(extraAccounting)); if (optimalSize >= parseInt(minimumTextHeight)) { document.querySelector('html').style.fontSize = optimalSize + "px"; } else { document.querySelector('html').style.fontSize = parseInt(minimumTextHeight) + "px"; } return true; } </script> </head> <body onload="scaleWidth();" onresize="scaleWidth();"> <div style="font-size:2rem">自适应大小</div> </body> </html>
顶一下 ▲()
踩一下 ▼()
发表留言
登录后才能发表留言,立即 登录 或 注册
提交 (Ctrl+Enter)