/

CSS · 解决 Chrome 中小于12px的字体不显示的问题

如设置字体大小为 10.2px

HTML

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

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;
}

参考：

%sveltekit.body%