如何動態調整文字大小以適合 Div？

在Div 內動態調整文字大小

在Web 開發中，通常需要確保文字適合指定的div，同時保留其文字大小可讀性。以下是實現此目的的方法：

假設您有一個帶有背景圖像的 div，並且想要添加動態調整其字體大小的文字。您可以使用 jQuery 來實現此目的：

<div>
<pre class="brush:php;toolbar:false">#fitin {
    width: 300px;
    height: 100px;
    border: 1px solid black;
    overflow: hidden;
    font-size: 1em;
}

$(function() {
    while( $('#fitin div').height() > $('#fitin').height() ) {
        $('#fitin div').css('font-size', (parseInt($('#fitin div').css('font-size')) - 1) + "px" );
    }
});

此程式碼不斷減少 div 內文字的字體大小，直到它適合 div 的高度。 while 循環迭代，直到文字高度小於或等於 div 的高度。