文章/答案/技术大牛

发布

社区首页 >问答首页 >中文字体的本地字体不适用于文本。

问中文字体的本地字体不适用于文本。
EN

Stack Overflow用户

提问于 2019-07-13 23:17:47

回答 1查看 335关注 0票数 0

我想向浏览器提供本地中文字体，但似乎不是chrome或firefox加载它们。这里可能出了什么问题？

我尝试过用各种方式编写路径--绝对路径/相对路径，但仍然无法工作。chrome的网络选项卡似乎没有反映加载任何本地字体文件。

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="font_face_index.css">
</head>
<body>
    <svg width="800" height="400">
        <text font-family='5' font-size="20px" y="50" x="50">咬释征巩个第涉景试为工给期催音足疗牛</text>
    </svg>

    <h2 style="font-family:'KaiTi';">咬释征巩个第涉景试为工给期催音足疗牛</h2> 
</body>
</html>

/ font_face_index.css /

@font-face{font-family:"0";font-style:normal;font-weight:400;src:url("subset_fonts_chinese_2700_glyphs/A Li Da Slender Bold Elegant Chinese Font -Simplified Chinese Fonts.ttf")format("ttf");}
@font-face{font-family:"1";font-style:normal;font-weight:400;src:url("subset_fonts_chinese_2700_glyphs/Aa Aquarius Chinese Font-Simplified Chinese Fonts.ttf")format("ttf");}
@font-face{font-family:"2";font-style:normal;font-weight:400;src:url("subset_fonts_chinese_2700_glyphs/Aa Devil May Cry Art Chinese Font – Simplified Chinese Fonts.ttf")format("ttf");}
@font-face{font-family:"3";font-style:normal;font-weight:400;src:url("subset_fonts_chinese_2700_glyphs/Aa Energetic Cute Chinese Font – Simplified Chinese Fonts.ttf")format("ttf");}
@font-face{font-family:"4";font-style:normal;font-weight:400;src:url("subset_fonts_chinese_2700_glyphs/Aa Pisces Bubble Chinese Font-Simplified Chinese Fonts.ttf")format("ttf");}
@font-face{font-family:"5";font-style:normal;font-weight:400;src:url("subset_fonts_chinese_2700_glyphs/Accompany you forever Font-Simplified Chinese.ttf")format("ttf");}

本地安装在我的机器上的“KaiTi”正在工作，而text默认为默认字体。(我试过这里列出的所有字体)。

font-face

truetype

html

css

fonts

回答 1

Stack Overflow用户

回答已采纳

发布于 2019-07-15 21:07:30

对于Windows，请在文件名中使用转义字符，或用连字符重写。

例如：

@font-face {
    font-family: 'A-Li-Da-Slender';
    src: url(font/A-Li-Da-Slender-Bold-Elegant-Chinese-Font-Simplified-Chinese-Fonts.ttf);
}

或

@font-face {
    font-family: 'A-Li-Da-Slender';
    src: url(font/Aa\ Aquarius\ Chinese\ Font-Simplified\ Chinese\ Fonts.ttf);
}

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/57023473

复制

相似问题

问中文字体的本地字体不适用于文本。
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问中文字体的本地字体不适用于文本。EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问中文字体的本地字体不适用于文本。
EN