css - 有没有办法在 twitter bootstrap 中通过屏幕宽度调整字体大小？

Question

我看过很多关于如何使用不同设备的媒体查询调整字体大小的帖子。但是有没有办法仅仅根据屏幕的宽度来使字体变大或变小？因此，如果您将浏览器窗口缩小到尽可能窄的宽度，则字体会变小，但如果您将窗口最大化，则字体会变大。

Answer 1

与其使用额外的库，我更喜欢使用:视口(viewport)、媒体查询和根据屏幕大小调整的字体大小。

1vw = 1% of viewport width
1vh = 1% of viewport height
1vmin = 1vw or 1vh, whichever is smaller
1vmax = 1vw or 1vh, whichever is larger

CSS:

@media(max-width:767px){
    .image-thumbnail > p{
        font-size: 3.0vw;
    }
}

CSS-Tricks 有更多关于此技术的信息:Viewport Sized Typography