Question

我尝试使用fittext调整文本大小。 div容器的宽度为200像素到200像素。结果应该是文本必须放在框中，无论文本有10或200个单词。

编辑：jQuery中的fittext无法适应更多行的文字，这是我的问题。

因此，我将尝试动态更多行的字体大小。如果我试试这个，你会发现我的问题。文本可以是动态的：

body{
   background-color: rgb(48, 54, 52);   
}   

.parent{
    position: relative;
    background-color: black;
    width: 200px;
    height: 200px;
    clear: both;
}

.child_1
{
    width: 200px;
    height: 200px;
    position: absolute;
    padding: 5px;
}

.child_1
{
    background-color: rgb(255, 255, 255);
    color: rgb(124, 170, 52);

}

<div>
<div class="parent">

<div class="child_1" >Lorem ipsum dolor sit amet, consectetuer adipiscing elit.Lorem 
ipsum dolor sit amet, consectetuer adipiscing elit.Lorem ipsum dolor sit amet,         
consectetuer adipiscing elit.</div>
</div>
</div>

<script src="jquery.fittext.js"></script>
<script type="text/javascript"> 
    $(".child_1").fitText(1.1, { minFontSize: 30, maxFontSize: '75px' });
</script>

Answer 1

如果你有一个固定尺寸的盒子，放了很多东西，显然会变满，你想要做的也是如此。

您需要动态调整de font-size或div width / height。

Answer 2

查看FitText documentation。它很简单：

$("#div_id").fitText();

然而，FitText根据容器的 width 而不是高度进行计算。如果你想在一行中拟合文本，那就太好了，但是如果你想把它放在一个盒子里就不是很有用。

如何在jQuery中使用fittext来调整div中的文本？ //编辑

2 个答案: