{"id":1935,"date":"2023-08-31T08:24:42","date_gmt":"2023-08-31T00:24:42","guid":{"rendered":"https:\/\/zhuxinyong.com\/?p=1935"},"modified":"2023-08-31T08:24:42","modified_gmt":"2023-08-31T00:24:42","slug":"%e8%87%aa%e5%ae%9a%e4%b9%89%e5%ad%97%e4%bd%93%e4%bc%98%e5%8c%96%e4%bd%93%e7%a7%af","status":"publish","type":"post","link":"https:\/\/zhuxinyong.com\/?p=1935","title":{"rendered":"<strong>\u81ea\u5b9a\u4e49\u5b57\u4f53\u4f18\u5316\u4f53\u79ef<\/strong>"},"content":{"rendered":"\n<p>\u4e0b\u9762\u56fe\u7684\u6570\u5b57\u4f7f\u7528\u4e86\u7279\u6b8a\u5b57\u4f53\uff1a<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"546\" src=\"https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830115526-1024x546.png\" alt=\"\" class=\"wp-image-1936\" srcset=\"https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830115526-1024x546.png 1024w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830115526-300x160.png 300w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830115526-768x409.png 768w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830115526-670x357.png 670w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830115526.png 1191w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>\u6240\u4ee5\u9700\u8981\u7528\u5230 <code>@font-face<\/code> \u6765\u52a0\u8f7d\u7279\u6b8a\u5b57\u4f53\u3002<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">@font-face {\n  font-family: \"Trickster\";\n  src:\n    local(\"Trickster\"),\n    url(\"trickster-COLRv1.otf\") format(\"opentype\") tech(color-COLRv1),\n    url(\"trickster-outline.otf\") format(\"opentype\"),\n    url(\"trickster-outline.woff\") format(\"woff\");\n}<\/code><\/pre>\n\n\n\n<p>\u8bbe\u8ba1\u5e08\u63d0\u4f9b\u4e86\u5b57\u4f53\u540e xxx.ttf\uff0c\u4e0a\u4f20 OSS \u540e\u5f97\u5230\u4e00\u4e2a\u94fe\u63a5\uff0c\u53d1\u73b0\u8fd9\u4e2a\u5b57\u4f53\u6709 102kb\u3002\u5c31\u4e3a\u8fd9\u51e0\u4e2a\u6570\u5b57\u589e\u52a0\u4e86 102kb \u7684\u8bf7\u6c42\u4e0d\u662f\u5f88\u5212\u7b97\u3002\u8bd5\u60f3\u6709\u6ca1\u6709\u53ef\u4ee5\u62bd\u53d6\u7528\u5230\u7684\u5b57\u7b26\u7684\u5b57\u4f53\uff0c\u56e0\u4e3a\u4e00\u79cd\u5b57\u4f53\u5305\u542b\u5f88\u591a\u79cd\u5b57\u7b26\u7684\u7c7b\u578b\uff1a<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"493\" src=\"https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830174638-1024x493.png\" alt=\"\" class=\"wp-image-1937\" srcset=\"https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830174638-1024x493.png 1024w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830174638-300x144.png 300w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830174638-768x370.png 768w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830174638-670x322.png 670w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830174638.png 1407w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>\u5176\u5b9e\u6211\u4eec\u53ea\u9700\u8981\u6570\u5b57\u90e8\u5206\u5c31\u884c\u4e86\uff0c\u7ecf\u63a2\u7d22\u8fd8\u771f\u6709\u53ef\u4ee5\u62bd\u79bb\u5b57\u4f53\u7684\u5de5\u5177\uff1a<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"497\" src=\"https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830174803-1024x497.png\" alt=\"\" class=\"wp-image-1938\" srcset=\"https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830174803-1024x497.png 1024w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830174803-300x145.png 300w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830174803-768x372.png 768w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830174803-1536x745.png 1536w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830174803-670x325.png 670w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830174803.png 1920w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>\u5982\u4e0a\u56fe\u9009\u4e2d\u9700\u8981\u7684\u5b57\u7b26\uff0c\u4e0b\u8f7d\u5c31\u884c\uff1a<\/p>\n\n\n\n<p>\u4f7f\u7528\u524d\uff1a<br><img decoding=\"async\" src=\"images\/Pasted%20image%2020230830175400.png\" alt=\"\"><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"38\" src=\"https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830175400-1024x38.png\" alt=\"\" class=\"wp-image-1939\" srcset=\"https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830175400-1024x38.png 1024w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830175400-300x11.png 300w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830175400-768x29.png 768w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830175400-670x25.png 670w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830175400.png 1094w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>\u4f7f\u7528\u540e\uff1a<br><img decoding=\"async\" src=\"images\/Pasted%20image%2020230830175303.png\" alt=\"\"><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"54\" src=\"https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830175303-1024x54.png\" alt=\"\" class=\"wp-image-1940\" srcset=\"https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830175303-1024x54.png 1024w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830175303-300x16.png 300w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830175303-768x40.png 768w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830175303-670x35.png 670w, https:\/\/zhuxinyong.com\/wp-content\/uploads\/2023\/08\/Pasted-image-20230830175303.png 1067w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>\u4f53\u79ef\u7f29\u5c0f\u4e8697.5%\u3002<\/p>\n\n\n\n<p><strong>\u4f7f\u7528\u65b9\u6cd5\uff1a<\/strong><\/p>\n\n\n\n<p>App.vue \u7684 style \u4e2d\u6dfb\u52a0\uff1a<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">@font-face {  \n  font-family: \"DIN Alternate\";  \n  src: url('https:\/\/xxxx.com\/JwbMpCwE34.ttf');\n}<\/code><\/pre>\n\n\n\n<p>\u9700\u8981\u4f7f\u7528\u7684\u5730\u65b9\uff1a<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">.number{\n    font-family:'DIN Alternate',\n    ...\n}<\/code><\/pre>\n\n\n\n<p>\u53c2\u8003\uff1a<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li><a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/CSS\/@font-face\" target=\"_blank\" rel=\"noopener\">@font-face &#8211; CSS: Cascading Style Sheets | MDN<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/font.qqe2.com\/\" target=\"_blank\" rel=\"noopener\">\u5728\u7ebf\u5b57\u4f53\u7f16\u8f91\u5668-JSON\u5728\u7ebf\u7f16\u8f91\u5668<\/a><\/li>\n<\/ol>\n","protected":false},"excerpt":{"rendered":"<p>\u4e0b\u9762\u56fe\u7684\u6570\u5b57\u4f7f\u7528\u4e86\u7279\u6b8a\u5b57\u4f53\uff1a \u6240\u4ee5\u9700\u8981\u7528\u5230 @font-face \u6765\u52a0\u8f7d\u7279\u6b8a\u5b57\u4f53\u3002 \u8bbe\u8ba1\u5e08\u63d0\u4f9b\u4e86\u5b57\u4f53&#46;&#46;&#46;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2,20,3],"tags":[5,6,258],"class_list":["post-1935","post","type-post","status-publish","format-standard","hentry","category-all","category-frontend","category-tech","tag-css","tag-javascript","tag-258"],"_links":{"self":[{"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=\/wp\/v2\/posts\/1935","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1935"}],"version-history":[{"count":1,"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=\/wp\/v2\/posts\/1935\/revisions"}],"predecessor-version":[{"id":1941,"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=\/wp\/v2\/posts\/1935\/revisions\/1941"}],"wp:attachment":[{"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1935"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1935"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/zhuxinyong.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1935"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}