美文网首页
[CSS3]字体自适应相关

[CSS3]字体自适应相关

作者: 误是人非_vv | 来源:发表于2018-05-02 11:21 被阅读0次
    image.png

    为了使字体大小较不同屏幕来说自适应,此处使用了vw的宽度单位
    15vw = 15% 视窗宽度
    此CSS 3单位兼容性:chrome 20+/ safari 6+/ IE 10+ / FF 19+ / IOS 6+

    参考示例

    <!DOCTYPE HTML> 
    <html> 
      <head> 
        <meta charset="UTF-8"> 
        <title>文字大小自适应实例</title>
        <style>
          #text{font-size:5vw;}
        </style>
      </head>
      <body>
        <div id="text">
    
          文本字体大小为5vw
    
        </div>
      </body>
    </html>
    

    参考资料:
    https://blog.csdn.net/wpy1282316637/article/details/78813338
    http://www.runoob.com/cssref/css-units.html

    相关文章

      网友评论

          本文标题:[CSS3]字体自适应相关

          本文链接:https://www.haomeiwen.com/subject/gqgqrftx.html