使用灵活的网格缩放字体标题

Question

在下面的场景中，我有基于百分比的列和间隔宽度。我希望(文本)列标题也缩放大小，如果在不同的设备或浏览器的宽度，如果它们是100%宽度的图像。

我快速查看了FitText jQuery扩展，它可以缩放文本以适应包含的元素，但在下面的示例中，这将涉及将标题放入三个自定义容器中，并对其进行调整以确保字体高度一致。

我也不希望依赖JavaScript。

有没有一种简单的方法，或者我应该咬紧牙关使用图像？

​

​

Answer 1

不要将图片用于文本*抖动*。

您可以使用fit-text或slab text (两者都做同样的事情)。

如果您正在寻找一种不需要JS的解决方案，那么您将不得不考虑添加一些额外的断点，以便在文本开始看起来不好时进行更改。你也可以在上面添加一些过渡效果，让它变得更平滑一些。