使用css或js强制适合字体高度[重复]答案

【问题标题】：Force fit height of font with css or js [duplicate]使用css或js强制适合字体高度[重复]
【发布时间】：2019-10-28 22:11:00
【问题描述】：

早在 2010 年左右就有人问过这个问题，但答案已经过时了。我想强制字体适应高度和宽度。

目前我有这个代码：

<div class="box" style="width:300px;height:300px; background-color: coral;">
  MY TEXT
</div>

使用找到的建议之一：textFit 或任何其他类似的脚本。
我可以做到以下几点：

我想要实现的是能够强迫它（即使它不成比例）做这样的事情：

可以是js或者css。无论哪种方式都可以实现。有什么想法吗？

【问题讨论】：

标签： javascript css

【解决方案1】：

let el = document.querySelector(".box");

let width = 300;
let height = 300;

let ws = (width / el.offsetWidth);

let hs = (height / el.offsetHeight);


el.style.transform = `scaleX(${ws}) scaleY(${hs})`;

<div class="box" style="display:inline-block; transform-origin: top left; background-color: coral;">
  MY TEXT
</div>

您可以使用transform: scale(x, y) 属性。

【讨论】：