12 px未満のフォントの実装

スケール方式を採用し、スケールされたラベルは依然としてスケール前の空間を占め、垂直方向は設定することができる.line-height: 1;は本来の空間を取り除き、上下の余白を調整し、横方向はmarginを負に調整するか、他の方法で解決することができる.
サンプルコード

.font-size-8 {
  display: inline-block;
  font-size: 12px;
  line-height: 1;
  -webkit-text-size-adjust: none;
  -webkit-transform: scale(0.666, 0.666);
}

.font-size-9 {
  display: inline-block;
  font-size: 12px;
  line-height: 1;
  -webkit-text-size-adjust: none;
  -webkit-transform: scale(0.75, 0.75);
}

.font-size-10 {
  display: inline-block;
  font-size: 12px;
  line-height: 1;
  -webkit-text-size-adjust: none;
  -webkit-transform: scale(0.833, 0.833);
}

.font-size-11 {
  display: inline-block;
  font-size: 12px;
  line-height: 1;
  -webkit-text-size-adjust: none;
  -webkit-transform: scale(0.916, 0.916);
}