2012-04-04 83 views
0

基本上,我希望文本的大小取決於文本的長度。如果我寫了「WWWWWWWW」,它將調整大小以適應100px div。 如果我寫「測試」它不會被調整大小,因爲它不會打破100px的限制。調整文本的大小以適應靜態div

我相信你現在已經明白了。 我對任何事情都開放。 Javascript,PHP,無論你必須提供什麼。

+0

您是否嘗試過使用單詞換行符?或者您想調整字體大小? – safarov 2012-04-04 18:40:10

回答

0

我認爲javascript是你的朋友,因爲它可以讓你最好地適應文本,而不管用戶的瀏覽器窗口大小(如果你用PHP做,超大/佈局會打破某些用戶)。

我有一個類似的問題,這使我爲此編寫自己的插件。如here所述,一種解決方案是使用縮小到適合的方法。 但是,如果您必須適合多個項目或關注性能,例如在窗口大小調整上,請查看jquery-quickfit

它爲文本的每個字母測量和計算尺寸不變尺寸以適合並使用它來計算適合文本到容器中的下一個最佳字體尺寸。

當處理多個文本或不得不多次調整文本時,例如在窗口大小調整時,緩存計算會使速度非常快(從第二次調整大小向前,幾乎沒有性能影響)。

Demo for a similar situation as yours

而且文檔,示例和源代碼是項目頁面上。

0

如果你使用一個固定寬度的字體(即所有字母寬度相等),那麼你可以使用PHP或JavaScript做到這一點。

使用strlen計算php中的字母數。然後硬編碼字體大小,例如這個例子展示了它如何完成,而不是最好的方法。如果您有任何問題,請告訴我。

代碼沒有工作正常 但

if(strlen($text)>5){ 
    $fontsize = 11px; 
} 

等等

0

做這樣的事情在PHP中:

$length = strlen($string); 

if($length < 5) 
{ 
    $added_class = 'short'; 
} 
elseif($length < 10) 
{ 
    $added_class = 'medium'; 
} 
else 
{ 
    $added_class = 'long'; 
} 

echo '<div class="normal_class '.$added_class.'">'.$string.'</div>'; 

而在你的CSS文件:

div.short { font-size: 15px } 
div.medium { font-size: 13px } 
div.long { font-size: 10px } 
相關問題