text-size-adjust在iOS Safari下横屏文字放大实例页面

展示

代码

• HTML：

  <h4>正常</h4>
  <ul class="normal">
      <li style="--fontSize:80;"></li>
      <li style="--fontSize:100;"></li>
      <li style="--fontSize:125;"></li>
      <li style="--fontSize:150;"></li>
  </ul>
  
  <h4>异常</h4>
  <ul>
      <li style="--fontSize:80;">font-size:80%</li>
      <li style="--fontSize:100;">font-size:100%</li>
      <li style="--fontSize:125;">font-size:125%</li>
      <li style="--fontSize:150;">font-size:150%</li>
  </ul>

• CSS：

  li {
      font-size: calc(var(--fontSize) * 1%);
  }
  .normal li::before {
      counter-reset: fontSize var(--fontSize);
      content: "font-size:" counter(fontSize) "%";
  }