我有一个<div>宽 400 像素，高 100 像素。我想在长度不同的标题中添加一个标题，它将在 <div> 中占据两行。如果足够长(即<div>的默认字体大小为50px)。我想让文本从 50 像素开始，如果文本太长而无法容纳在两行框中，则将其缩小。
我该如何解决这个问题？我已经玩了几个小时的 Javascript，但我无法想出或找到任何东西。我所能找到的只是如何对一行文本执行此操作。
最佳答案
您将需要一些 JavaScript 来解决这个问题。 这是我的示例标记
<div style="width: 400px; border: 1px solid black;">
<span style="display: inline-block; font-size: 50px;">This is my text that I want to fit</span>
</div>
我给了跨度显示值inline-block，这样我就可以测量它的宽度。
然后以下基于 jquery 的脚本将使其收缩，直到它变得有点太小。
$(function() {
var span = $('span');
var fontSize = parseInt(span.css('font-size'));
do {
fontSize--;
span.css('font-size', fontSize.toString() + 'px');
} while (span.width() >= 400);
});
查看 JSFiddle 进行演示:http://jsfiddle.net/gEjTz/
关于jquery - 调整固定大小 div 中的文本大小以适合，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17966307/