Question

我正在尝试使用@font-face直接嵌入字体，就像我见过的例子一样。 Visual Studio将我的url(...)函数标记为具有不平衡的parantheses，并将一堆base-64字符标记为意外。另外，我的页面没有呈现字体。所以我知道一定有些不对劲。

注意：由于SO帖子的字符数限制，我缩短了base-64字符串。

@font-face { font-family: 'CHNfnt_R'; font-style: normal; font-weight: 400; src: url(data:font/truetype;base64,
AAEAAAATAQAABAAwRkZUTV/PWxEAAAE8AAAAHEdERUYC8gHSAAABWAAAACxHUE9Tsxt/TQAAAYQA
AA3iR1NVQibDINUAAA9oAAAAYE9TLzK5Ivx/AAAPyAAAAGBjbWFwn9BCKgAAECgAAAHiY3Z0IBgY
EWAAABIMAAAAQmZwZ21TtC+nAAASUAAAAmVnYXNwAAAAEAAAFLgAAAAIZ2x5ZhleacIAABTAAACN
vGhlYWQDbZjlAACifAAAADZoaGVhDAQIEWyDzsCK7EDRnYrRLARIEWyEDUCK7EDRnYrRLASIEWyEWkCK7ED
RnYrRLATIEWyEjsCK7EDRnYrRLAUIEWyEzoCK7EDRnYrRLAVIEWyFDkCK7EDRnYrRLAWIEWyFTYC
K7EDRnYrRLAXIEWyFi4CK7EDRnYrRFmwFCsAAAFSe/aUAAA=) 
format('truetype');}

Answer 1

正确的语法是：

@font-face {
font-family:"font-name";
src:url(data:font/opentype;base64,[base-64 code here]);
    url('font.ttf') format('truetype');
font-style:normal;
font-weight:400;
}

@font-face {
font-family:"font-name";
src:url(data:font/opentype;base64,[base-64 code here]);
    url('font.ttf') format('truetype');
font-style:normal;
font-weight:600;
}

@font-face {
font-family:"font-name";
src:url(data:font/opentype;base64,[base-64 code here]);
    url('font.ttf') format('truetype');
font-style:normal;
font-weight:900;
}

直接将base64字符串嵌入@ font-face。我的语法不正确吗？

1 个答案: