用浏览器窗口更改CSS字体大小

这是可能的CSS或JavaScript？所以，如果我想在特定浏览器大小的情况下使用20pt字体或1em字体或类似字体，但如果浏览器窗口缩小或展开，字体会缩小并展开？谢谢用浏览器窗口更改CSS字体大小

来源

2011-09-11 user852974

CSS3值和单位覆盖基于视口的相对大小，但目前仅支持IE9。 http://www.w3.org/TR/css3-values/#viewport-relative-lengths – DuMaurier

您可以使用onResize事件来做到这一点。可以利用jQuery来做到这一点，例如：http://api.jquery.com/resize/。您只需要对特定元素应用适当的CSS更改。

来源

2011-09-11 10:16:46

有没有适当的CSS解决方案，我知道。您可以用％定义字体大小，但会占用父元素字体的像素的百分比。

你可以使用媒体查询，但他们会变得更大，步骤不流利。

.p { 
    font-size: 20px; 
}  
@media screen and (max-width: 600px) { 
    .p { 
    font-size: 12px; 
    } 
} 
@media screen and (max-width: 800px) { 
    .p { 
    font-size: 14px; 
    } 
} 
@media screen and (max-width: 1000px) { 
    .p { 
    font-size: 16px; 
    } 
} 
@media screen and (max-width: 1200px) { 
    .p { 
    font-size: 18px; 
    } 
}

来源

2011-09-11 10:21:14

当浏览器被调整大小时，他正在尝试做到这一点，因为CSS无法在浏览器上读取/操作，因此CSS在此无所事事视口大小。 –

这是一个解决方案，不依赖于CSS3或Javascript的（非广泛支持的部分）工作。它使用媒体查询来改变字体大小，但由于采用SASS它是简明扼要的表述，它非常容易使用：

http://github.com/wadim/responsive-font-size

有四个参数提供该混入会智能地找出正确的媒体查询为你定义。

来源

2013-02-10 15:48:54 wadim

用浏览器窗口更改CSS字体大小

回答

相关问题