时间戳

首页 > 解决方案 > 安装网络字体的问题

css - 安装网络字体的问题

问题描述

所以我在安装新字体时遇到问题
http://shop3.afsaionco.cafe24.com/

这就是我所做的......

1.我将字体文件上传到ftp
（我确保我将字体链接到正确的位置和正确的名称）

2.我将字体文件链接到css 

@font-face{
    font-family:"AvantGardeGothicITC W01 Demi";
    src:url("/_wg/library/font/09084aa9-ea01-41e8-a48b-f50a0140a5f8.eot?#iefix");
    src:url("/_wg/library/font/09084aa9-ea01-41e8-a48b-f50a0140a5f8.eot?#iefix") format("eot"),
        url("/_wg/library/font/0d291d38-c6e0-490d-87d0-44a67459b66f.woff2") format("woff2"),
        url("/_wg/library/font/8f2d8a6d-bbd7-4e31-b0ae-e8463f00e5d8.woff") format("woff"),
        url("/_wg/library/font/e75a3380-27b0-4f88-9425-d3c364b421cb.ttf") format("truetype");
}
@font-face{
    font-family:"AvantGardeGothicITC W01 Dm Obl";
    src:url("/_wg/library/font/9f7a56d2-23f0-4dc7-a542-bd22a588ecd2.eot?#iefix");
    src:url("/_wg/library/font/9f7a56d2-23f0-4dc7-a542-bd22a588ecd2.eot?#iefix") format("eot"),
        url("/_wg/library/font/b4cb7559-dc94-43a6-b71a-a8ecc727118a.woff2") format("woff2"),
        url("/_wg/library/font/d76bf03a-2f4b-4567-9ab5-5766957e5a4d.woff") format("woff"),
        url("/_wg/library/font/3ae1178d-3fc1-4efb-b644-e99ef3f39a09.ttf") format("truetype");
}
@font-face{
    font-family:"AvantGardeGothicITC W01 Book";
    src:url("/_wg/library/font/a98bdca9-ab20-41a6-98f3-ed6bb54ed69e.eot?#iefix");
    src:url("/_wg/library/font/a98bdca9-ab20-41a6-98f3-ed6bb54ed69e.eot?#iefix") format("eot"),
        url("/_wg/library/font/5b13893e-ac07-4b49-b0e4-355de4e4df8d.woff2") format("woff2"),
        url("/_wg/library/font/a9e70966-2348-4c54-ace1-7f809fcee055.woff") format("woff"),
        url("/_wg/library/font/9cb9e06e-0507-4768-ad8f-cba7f3ec98b6.ttf") format("truetype");
}
@font-face{
    font-family:"AvantGardeGothicITC W01 Bk Obl";
    src:url("/_wg/library/font/2e5d7ec4-040b-4dc0-a849-68d6d09ed47c.eot?#iefix");
    src:url("/_wg/library/font/2e5d7ec4-040b-4dc0-a849-68d6d09ed47c.eot?#iefix") format("eot"),
        url("/_wg/library/font/4cb92b29-fd12-480a-8bce-3199256d07a5.woff2") format("woff2"),
        url("/_wg/library/font/e9d0be45-fe56-4db5-aad8-8ce6916f9aca.woff") format("woff"),
        url("/_wg/library/font/0ee45fbd-9079-4aa6-aab0-316074ca2b56.ttf") format("truetype");
}

3. 然后我将字体添加到 common.css 文件中

html { 宽度：100%; 高度：100%；字体系列：“AvantGardeGothicITC W01 Demi”、“AvantGardeGothicITC W01 Dm Obl”、“AvantGardeGothicITC W01 Book”、“AvantGardeGothicITC W01 Bk Obl”}

body,code { font:0.75em "AvantGardeGothicITC W01 Demi", "AvantGardeGothicITC W01 Dm Obl", "AvantGardeGothicITC W01 Book", "AvantGardeGothicITC W01 Bk Obl", sans-serif; 颜色：#353535; 背景：#fff; }

像这样...

但是，它仍然链接到一些我什至无法找到的随机 deafault.css 文件。为什么网站如此拒绝使用我下载的字体并继续使用默认字体？（问题出现在 Internet Explorer 和 chrome 中）

请帮忙！！！！

标签： cssfontswebfonts

解决方案

CSS 级联（层叠样式表），因此您的自定义 CSS 可能在您的 default.css 文件之前加载。

最简单的方法是从默认 CSS 中删除字体规则。我不建议这样做，但您可以通过在每条规则的末尾添加 !important 来解决它，例如

html { width:100%; height:100%; font-family:"AvantGardeGothicITC W01 Demi", "AvantGardeGothicITC W01 Dm Obl", "AvantGardeGothicITC W01 Book", "AvantGardeGothicITC W01 Bk Obl" !important}

body,code { font:0.75em "AvantGardeGothicITC W01 Demi", "AvantGardeGothicITC W01 Dm Obl", "AvantGardeGothicITC W01 Book", "AvantGardeGothicITC W01 Bk Obl", sans-serif !important; color:#353535; background:#fff; }

推荐阅读