現在製作RWD自適應網頁，已是網頁的基本需求了，而自適應最大的特點就是，無論今天是使用任何的裝置，網頁都能依照裝置的解析，調整版型讓網頁皆能在各裝置中顯示，而這一切都要歸功於CSS3，新增了許多新的屬性，讓網頁能在各裝置中作設定，並且讓網頁中的區塊、圖片自動的縮放比例，以符合各裝置中的解析。
而無論是DIV的區塊還是IMG影像，都能自行的縮放比例，唯獨文字的部分，是一個令人比較頭大的部分，雖然說在文字的屬性中，也多了幾個新的單位，但還是無法達到完美的縮放，還是得再手動設定，才能讓文字在各個裝置中，閱讀起來大小合宜，為了解決文字自動縮放的問題，最近梅干發現FitText.js這隻外掛，還真是一個好物，可設定文字的縮放區間，讓文字在各裝置，閱讀起來大小適中，至於要怎來使用FitText.js，現在就一塊來看看吧！
FitText.js
外掛名稱：FitText.js
外掛下載：https://github.com/davatron5000/FitText.js
外掛下載：https://github.com/davatron5000/FitText.js
Step1
首先，將外掛下載完畢後，分別先將jquery與fittext.js加到body結尾上方。
<script src="http://libs.useso.com/js/jquery/1.9.1/jquery.min.js"></script> <script src="jquery.fittext.js"></script>
Step2
接著將文字加到body間，而這邊梅干分別使用了一個h1並將它id設為「fittext」與一個p標籤裡面則放了一些簡短的說明文字。
<div class="container"> <h1 id="fittext">[開箱] PICO輕巧隨身探色器！你說的白是什麼白讓PICO來告訴你</h1> <p>顏色是一件無法用三二句言詞，就能將顏色清楚的表達出來，因此只是口中的一個紅，就有千百種的變化，而每人心中的紅色都有所不同，所以要讓對方能清楚的知道是那一個紅、那一個黃、那一個藍，最快的方法，就是找到實體的顏色，或是色票才能讓對方清楚的知道，原來你心中的紅是那一個紅。</p> </div>
Step3
這再啟用FitText，而經梅干實測後，縮放系數+設定字級大小區間最為好用，而在$(“選擇要套用的元素或名稱”).fitText(縮放倍數, { minFontSize: ‘最小文字字級’, maxFontSize: ‘最大文字字級’ });，因此梅干就設定字級在18px到48px間，這時它就會自動依照區塊比例，調整文字的字級大小。
$("#fittext").fitText(1.5, { minFontSize: '18px', maxFontSize: '48px' });
Step4
當設定好後，開啟瀏覽器來預覽一下，這時文字就會依照，區塊間來作調整。
Step5
當縮成行動裝置時，文字也會依照區塊縮小，但最小值就是剛所設定的18px，所以完全不用擔心在手機中閱讀文字感到吃力，而FitText.js真是一個好物，因此身為網設的你，這隻外掛千萬別錯過了。
#範例預覽