rem.ts 711 B

123456789101112131415161718
  1. // 基准大小
  2. const baseSize = 16;
  3. // 设置 rem 函数
  4. function setRem() {
  5. // 当前页面宽度相对于 1920 宽的缩放比例,可根据自己需要修改。
  6. const scale = document.documentElement.clientWidth / 1920;
  7. // 设置页面根节点字体大小, 浏览器字体大小最小为12 ↓ 采用下面
  8. // let fontSize = baseSize * Math.min(scale, 2) > 12 ? baseSize * Math.min(scale, 2) : 12;
  9. // electron 可以更小 ↓ (个人项目需要)
  10. let fontSize = baseSize * Math.min(scale, 2);
  11. document.documentElement.style.fontSize = fontSize + "px";
  12. }
  13. // 初始化
  14. setRem();
  15. // 改变窗口大小时重新设置 rem,这里最好加上节流
  16. window.onresize = function () {
  17. setRem();
  18. };