代码之家  ›  专栏  ›  技术社区  ›  null

即使未使用,@font face字体是否也由浏览器加载?

font-face css
  •  5
  • null  · 技术社区  · 14 年前

    所以我有一堆: 

     @font-face {
    font-family: 'MyCustomFont';
    src: url('MyCustomFont.ttf') format('truetype');
 }

 body { font-family: Helvetica, MyCustomFont, Arial, sans-serif; }

    是 MyCustomFont.tff 即使计算机中存在Helvetica(即:Mac用户),也由浏览器加载?

    2 回复  |  直到 14 年前
        1
  •  4
  •   Mike    14 年前

    你需要使用 local 

    @font-face {
    font-family: MyHelvetica;
    src: local("Helvetica Neue Bold"),
    local("HelveticaNeue-Bold"),
    url(MgOpenModernaBold.ttf);
    font-weight: bold;
}

    上面的例子取自这里:
    https://developer.mozilla.org/en/css/@font-face

    这里有更多信息:
    http://www.broken-links.com/2009/06/30/checking-for-installed-fonts-with-font-face-and-local/

    下载字体后,浏览器将缓存该字体。一旦进入缓存,浏览器就不必再次下载字体,从而加快了速度。有关更多信息,请参见此处:
    http://code.google.com/apis/webfonts/faq.html#Performance

        2
  •  1
  •   vieron    13 年前

    Jake Archibald在Dibi 2011中对此做了一次非常好的演讲。

    您可以在这里看到: http://vimeo.com/27771157

    http://speakerdeck.com/u/jaffathecake/p/in-your-font-face?slide=39

    推荐文章
    Jamie  ·  在CSS链接的文件名中添加Jinja占位符
    3 月前
    Mass  ·  如何在Tailwind CSS v4中创建配置
    4 月前
    magenta placenta  ·  将css变量合并为一个变量
    4 月前
    ptownbro  ·  重叠分区标签,同时保持以下所有分区和内容就位
    4 月前
    Luke Frost IEng MIMechE  ·  Bootstrap 5.3在Div中的项目位置没有如我所期望的那样显示
    4 月前
    user29519291  ·  为不同的变量创建一个带有可重用Click函数的简单菜单
    4 月前
    john Rizzo  ·  按钮背景颜色、悬停和活动状态存在问题
    4 月前
    Ben Halicki  ·  带有垂直和水平滚动条的表,使用HTML/CSS/Bootstrap-5固定行和列
    4 月前
    Luckkks  ·  过渡色工作不正常
    4 月前
    ModernEraCaveman  ·  如何对齐我的Bootstrap容器以适应网页的整个宽度?
    4 月前
    关于  
    代码之家 - 一站式码农服务社区
    沪ICP备11025650号