Urara-Blog/urara/2022-03-29-12px/+page.md
2022-09-07 23:29:18 +08:00

1.2 KiB
Raw Blame History

title lastmod summary created tags categories toc
CSS · 解决 Chrome 中小于12px的字体不显示的问题 2022-04-07T07:36:23.629Z 先用scale总体缩小再补上减少的宽度 2022-03-29T13:46:29.228Z
CSS
CSS Trick
CSS
false

如设置字体大小为 10.2px

HTML

<p>
  I am a frontend developer with a particular interest in making things simple and automating daily tasks. I try to keep up with
  security and best practices, and am always looking for new things to learn.
</p>

CSS

p {
  color: #dcdcdc;

  /*缩小基准大小,也就是缩小后的字体应该是 10.2px=12px*0.85*/
  font-size: 12px;

  /* 缩小比例 10.2px/12px=0.85 */
  transform: scale(0.85);

  /*设置缩放中心*/
  transform-origin: 0 0;

  /*(1-0.85)+1补上缩小的宽度这里可以按视觉效果调整一点*/
  width: 118%;

  /*兼容IE*/
  *font-size: 10.2px;
}

参考: