涉及文件
字体文件
效果
index.html
<!DOCTYPE html>
<html>
<head>
<title>你好</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<p>我用的字体是</p>
<p>【JetBrainsMono+HarmonyOS_Sans_SC_Regular】</p>
<p>ABCDEFGHIJKLMNOPQRSTUVWXYZ</p>
<p>abcdefghijklmnopqrstuvwxyz</p>
<p>0123456789</p>
</body>
</html>
style.css
@font-face {
font-family: "JetBrainsMono";
src: url("./font/JetBrainsMono-Regular.woff2") format("woff2");
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "HarmonyOS";
src: url("./font/HarmonyOS_Sans_SC_Regular.ttf") format("truetype");
font-weight: normal;
font-style: normal;
font-display: swap;
}
html,body{
font-family: "JetBrainsMono", "HarmonyOS";
}