zoukankan      html  css  js  c++  java
  • font-face自定义字体

    做网站的时候,有时候会遇到某些字体系统里面没有自带。可能更多的时候我们会选择以图替文的方式来做。用图片的话不利于图片的放大缩小,更好的办法是我们可以自定义字体。

    当然,在实际运用中我们需要权衡一下自定义字体的利弊。自定义字体的话,我们需要引入多种格式,如下图:

    所以,如果自定义字体的话必然会增加网页的体积,尤其是中文格式。

    自定义字体的方法如下:

    1.找到这个字体的ttf格式,再用字体转换工具转换成不同的格式。

    常见的字体格式转换工具有:FontsQuirrel、onlinefontconverter(个人比较喜欢用这个)。

    2.利用css自定义字体:

    @font-face {
        font-family: 'Playbill';  /*给自定义字体命名*/
        src: url('Playbill.eot');
        src: url('Playbill.eot?#iefix') format('eot'),
             url('Playbill.woff') format('woff'),
             url('Playbill.ttf') format('truetype'),
             url('Playbill.svg#webfontjKg17VrE') format('svg');
    }

    3.在你需要的地方引用字体:

    body{font-family:"Playbill"}

    ok!就这三步,大功告成!

  • 相关阅读:
    「CSP-S2020」贪吃蛇
    CSP-S 2020 游记
    「POI2012」Leveling Ground
    「THUPC2019」鸭棋
    「SNOI2020」取石子 题解
    第一篇随笔
    实验三 面向对象分析与设计
    高斯模型
    实验二 结构化分析与设计
    极大似然估计
  • 原文地址:https://www.cnblogs.com/sese/p/6438728.html
Copyright © 2011-2022 走看看