根据窗口宽度响应字体大小，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可以吗？

回答

相关问题