唐山企业调整外贸网站小字时,应同时检查默认状态看不看得清,以及读者放大后能不能继续操作。把所有px换成rem并不自动解决问题,根字号、局部覆盖和布局都可能改变结果。先定项目要求,再取真实计算值和放大表现。

先做一个可解释的单位比较

<style>
  html { font-size: 16px; }
  .demo-px { font-size: 12px; }
  .demo-rem { font-size: .75rem; }
</style>
<p class="demo-px">固定CSS像素示意</p>
<p class="demo-rem">根字号比例示意</p>

rem相对根元素字号。这个示例在根字号16px时,两段计算为12px;若仅把根字号改为20px,rem段计算为15px,px段仍为12px。这是单位计算演示,不表示浏览器缩放、系统字体或整页布局都只受这一处控制。

把单位计算与真实阅读分成两张表

示意计算,不是线上测量
条件12px段0.75rem段
根字号16px12px12px
根字号20px12px15px
整页缩放或系统设置需按环境实际复测同样需实际复测

小屏与放大都查内容有没有被截掉

  1. 按真实页面取可见文字计算字号,找出局部覆盖。
  2. 检查正文、按钮、表注及页脚,不只看标题。
  3. 放大后检查重叠、裁切与悬浮组件遮挡。
  4. 表格可以有明确的局部滚动,但页面不应无故横向撑开。
  5. 修改单位后复查根字号及继承关系,避免反而缩小。
1约定明确最低值与阅读要求。
2计算查看真实样式结果。
3放大复查内容与操作。
4回归覆盖手机、页脚和固定组件。
字号验收路径
全部用rem就一定符合要求吗?

不一定,要看根字号、比例和覆盖规则,并按实际计算值验收。

截图看着清楚就够吗?

截图不能代替字体设置、放大和真实操作检查。