pc 端使用 postcss-pxtorem 做自适应，到 移动端字体变小

PC端使用PostCSS px to rem插件将像素单位转换为相对单位（如rem），可以方便地实现响应式设计，让页面元素随视口尺寸的变化而调整大小。当把样式应用到移动端时，如果根元素`html`的font-size值设得较小（默认情况下，移动设备的初始`font-size`可能会小于pc端），字体和其他基于rem单位的尺寸就会相应减小。

例如，在PC上可能设置了一个20px的字体大小，转换成rem就是`20rem`。但在移动端，如果`html`的`font-size`为16px，那么20rem将会等同于`320px`，这就导致了字体比预期的小很多。

解决这个问题通常有几种方法：

1. **动态设置font-size**: 可以通过媒体查询检测设备宽度，然后动态计算并设置`html`的`font-size`，使之在适配不同屏幕尺寸时保持合理的字号比例。

/* 使用postcss-pxtorem处理 */
@media (max-width: 750px) {
  html {
    font-size: 14px; /* 或者其他适合移动端的数值 */
  }
}

/* 直接设置rem单位 */
body {
  font-size: calc(20rem / 14);
}

2. **使用vw或vh单位**：这些视窗宽度或高度百分比单位更适合用于响应式布局，它们会自动根据设备窗口大小缩放。

3. **保留基础字体大小并使用em**：虽然不是直接依赖于px到rem的转换，但可以保证字体大小在整个布局中相对一致。

body {
  font-size: 16px;
  .some-text {
    font-size: 1.2em; /* 文字大小是父元素的一半 */
  }
}