先看代码，复制使用即可，以下代码均可复制粘贴使用（我将以注释的形式解释代码左右）。
如您满意请给莫成尘点个Fabulous
牛顿说过：我之所以看得远,是因为我站在巨人的肩膀上，我们充分借鉴了element，antd等的方案来适配。
需
要
注
意
的
是
使
用
了
这
个
方
案
，
您
最
好
使
用
r
e
m
作
为
单
位
来
设
置
c
s
s
，
\color{#FF0000}{需要注意的是使用了这个方案，您最好使用rem作为单位来设置css，}
需要注意的是使用了这个方案，您最好使用rem作为单位来设置css，
如
果
觉
得
自
己
计
算
比
较
麻
烦
，
可
以
使
用
您
的
编
译
器
设
置
\color{#FF0000}{如果觉得自己计算比较麻烦，可以使用您的编译器设置}
如果觉得自己计算比较麻烦，可以使用您的编译器设置
也
可
以
在
蓝
湖
中
指
定
宽
度
为
120
如
下
图
片
\color{#FF0000}{也可以在蓝湖中指定宽度为120 如下图片}
也可以在蓝湖中指定宽度为120如下图片
<!DOCTYPE html>
<html lang="zh">
<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></title>
</head>
<body>
</body>
<script type="text/javascript" charset="utf-8">
//element 24栅栏布局是将页面等分为24份
(function rem() {
let fonts = document.documentElement.clientWidth / 120
//我们获取到document.documentElement.clientWidth 即当前浏览器宽度 等分为120份
// 一份的大小 在1440屏幕下 为12px， 在1920屏幕下 为16px
if (fonts <= 12) {
fonts = 12;
document.documentElement.style.fontSize = fonts + "px"
//当字体小于12 即1440 屏幕以下 我们让其为12
document.documentElement.style.minWidth = '1440px'
//同时设置屏幕的最小宽度为1440px
} else if (fonts > 12 && fonts <= 16) {
//如果在12--16之间 我们认为 此时屏幕宽度为 1440-1920之间 就可以使用
document.documentElement.style.fontSize = document.documentElement.clientWidth / 120 + 'px';
}
window.onresize = rem;
//window的窗口发生变化时 执行rem 函数
// 想必您已经知道了 我们在设置css 的单位时 将使用 rem
// 比如 设计图 1920下 为100px 那么此时的单位应该为 6.25rem
})()
</script>
<script type="text/javascript">
//以下代码监听dom框架加载完成 做了一些常用处理
document.addEventListener('DOMContentLoaded', function (event) {
//chrome浏览器
document.body.style.zoom = 'reset';
document.addEventListener('keydown', function (e) {
if ((e.ctrlKey === true || e.metaKey === true) &&
(e.which === 61 || e.which === 107 || e.which === 173 || e.which === 109
|| e.which === 187 || e.which === 189)) {
e.preventDefault();
}
}, false);
document.addEventListener('mousewhell DOMMouseScroll', function (e) {
if (e.ctrlKey === true || e.metaKey === true) {
e.preventDefault();
}
}, false);
}, false);
</script>
</html>
附加和可能出现的有用信息已添加注释
