根據窗口寬度響應字體大小，CSS可以嗎？

我已經在Wordpress上製作了一個響應式設計，並調整了所有內容。整個佈局和幻燈片和插件會根據窗口寬度進行調整，但我無法使字體響應。我已經嘗試了許多不同的百分比選項，現在也用Vw和Vh。它確實有效，但視口寬度和高度單位間隔太大，不幸的是，當窗口調整大小時，變化非常顯着。我需要一些平滑的方法來縮小字體大小，但窗口大小几乎沒有變化，最好是將最小寬度設置爲某個固定單位。請幫助我，只用CSS可以嗎？根據窗口寬度響應字體大小，CSS可以嗎？

來源

2014-02-17 Irakli Bobokhidze

聽起來像你想對字體大小有很好的控制。

在CSS-Tricks上有一篇很棒的文章概述了您的一些選項。 Chris建議使用vmin來控制font-size。經過試驗後，我建議使用vmax，因爲它會選擇最大值vw和vh，這也是您提到的最小字體大小。

喜歡的東西：

p { 

    font-size: 2vmax; 

}

還要注意：有一個bug in Chrome 20+/Safara 6+禁止將該字體從根據新的視口大小調整本身。

如果這不夠細粒不夠，我想你將不得不使用js。我建議這些細插件之一會：

來源

2014-02-18 00:37:05

謝謝你爲一個偉大的建議，我認爲你是對的，但我實際使用VMAX的時刻當我把窗口大小縮小到1024或稍大時，文字太小，我幾乎看不懂。我必須看到那個，但謝謝你的一個很好的答案。我不關心舊瀏覽器，只要它在新的瀏覽器中工作:) –

它也有賴於包含元素的佈局/大小。例如，包含元素的最小寬度/最小高度可能會阻止文本太小。或者，您可以將它與「媒體」查詢耦合，以便在切換到使用像素或其他固定字體大小的某個斷點之下。 –

是不是有像百分比相對於父元素的寬度和高度的東西。例如應該有一個容器字體大小，然後應該有子元素的字體大小，怎麼沒有一些功能，如最小字體大小或類似的東西。它太愚蠢了！ –

根據窗口寬度響應字體大小，CSS可以嗎？

回答

相關問題