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

調整文字大小以適合Div

在您的情況下，您有一個帶有要在其中顯示文字的div 的背景圖像。但是，您希望文字的字體大小自動調整以適合 div。要實現此目的，請考慮以下解決方案：

jQuery實現：

http://jsfiddle.net/MYSVL/2/

HTML：

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

JavaScript:

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

這個程式碼迭代地縮小字體大小，直到文字緊貼字體在 div 內。