调整窗口大小时展开的字体大小

Question

如何在HTML中创建字体,以便在展开窗口时,文本的大小也会扩展.类似于设置文本的百分比,该百分比将采用其所在框的大小的百分比.

以下是我想要发生的事情的说明:

#box #text {
   font-size: 50%;
}

现在让我们说#box是200px,#text应该是100px.显然,我不能只为一个固定宽度,#text因为在该网站#box将是一个动态宽度.

Answer 1

在jquery中做.

$(window).resize(function(){
    $('#box #text').css('font-size',($(window).width()*0.5)+'px');
});

Answer 2

在完全支持CSS3的浏览器中使用vh(视口高度),vw(视口宽度)和/或vm(视口最小(最小尺寸))单位,以及其他浏览器resize和Razor Storm的答案中的JavaScript等.