有没有办法在twitter bootstrap中按屏幕宽度调整字体大小?

时间:2014-12-20 09:21:33

标签: css twitter-bootstrap

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

2 个答案:

答案 0 :(得分:1)

我更喜欢使用:视口,媒体查询和根据屏幕尺寸调整的字体大小,而不是使用额外的库。

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

答案 1 :(得分:0)

查看

Flowtype.js

这会使您的字体响应