有人问过类似的问题，但是解决方案确实与我正在尝试做的事情相吻合。基本上，我有一篇标题为（<h1>）的文章。我不想控制标题的长度，但是我也不想标题显示在多行上。CSS或jQuery是否可以根据<div>标签的宽度来调整文本大小？
<h1>
<div>
我知道如果可以检测到文本与边缘的重叠，我将如何处理伪代码<div>：
var fontize = $("#title").css("font-size"); var i = /*remove unit from integer*/ while( /*text overlaps div*/ ){ $("#title").css("font-size", --i+"pt"); }
如果有一个CSS属性，我可以设置为更好，但是我似乎找不到（在这种情况下，溢出不会起作用）。
您无法使用CSS进行此操作，但是可以在javascript / jQuery中进行。为了帮助您使用伪代码，因为您已经知道该怎么做。只是您不知道如何检测多余的宽度。
最好的方法是使DIV具有以下（至少）样式：
position: absolute; visibility: hidden; white-space: nowrap; font-family: /* same as your title's */
然后将文本复制到该文本并设置一些起始字体大小。然后，您可以遍历while循环，并在div的宽度合适时停止。然后将计算出的字体大小设置为原始标题。
这样，该检查将对用户不可见，因此也将更快地工作。
顺便说一句 ：这是自动增长textarea脚本工作的通常方式。他们使用虚拟div，其样式设置与原始文本区域相同，并在用户键入文本时调整区域的高度。因此，起初“文本”区域可能很小，但是如果用户键入大量文本，它将自动增长以容纳内容。
textarea
您可以通过以下方法优化while循环，以大大减少迭代次数：
