<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Document</title>
<script>
// i = 750 , 750代表设计师给的设计稿的宽度,你的设计稿是多少,就写多少;
// d = i / 100, 100代表换算比例,这里写100是为了以后好算;
// 比如,你测量的一个宽度是100px,就可以写为1rem,以及1px=0.01rem等等
// 当然了,要把这段js代码最好封装在一个单独的js文件里,并且放在所有的css文件引入之前加载。
!(function(n) {
let e = n.document,
t = e.documentElement,
i = 750,
d = i / 100,
o = 'orientationchange' in n ? 'orientationchange' : 'resize',
a = function() {
let n = t.cli
移动端自适应rem.js的使用方法(不用三大框架,仅写一个单html页面使用)
最新推荐文章于 2023-09-19 17:01:20 发布
本文介绍了在不依赖前端框架的情况下,如何在一个独立的HTML页面中使用rem.js实现移动端页面的自适应布局。通过调整根元素字体大小,实现不同设备宽度下的适配,确保界面在各种屏幕尺寸下都能保持良好的显示效果。
摘要由CSDN通过智能技术生成