html字体大小vw,CSS响应字体大小

若吾皇

这个font-size在调整浏览器窗口大小时不会像这样响应。相反，它们响应浏览器缩放/类型大小设置，比如您按下克特和+在浏览器中同时在键盘上。媒体查询你必须考虑使用媒体查询减少字体大小在一定的时间间隔，它开始打破您的设计和创建滚动条。例如，尝试将其添加到CSS底部的CSS中，更改320 px宽度，用于设计开始中断的地方：@media only screen and (max-width: 320px) {

   body { 

      font-size: 2em; 

   }}视口百分比长度您也可以使用视口百分比长度比如vw, vh, vmin和vmax..W3C的官方文件指出：视口百分比长度相对于初始包含块的大小。当初始包含块的高度或宽度发生变化时，它们相应地进行缩放。同样，从同一W3C文档中可以定义每个单元如下：VW单元-等于初始包含块宽度的1%。VH单元-等于初始包含块高度的1%。vmin单位-等于较小的大众或VH。Vmax单位-等于较大的大众或VH。它们的使用方式与任何其他CSS值完全相同：.text {

  font-size: 3vw;}.other-text {

  font-size: 5vh;}可以看出，兼容性相对较好。这里..但是，有些版本的IE和Edge不支持Vmax。此外，iOS 6和7与VH单元有问题，这是在iOS 8中修复的。