在网页中实现炫酷的字体，是每一个前端必备的技能；然而计算机中提供的字体，无论是样式上还是颜色上都不能让我们这些设计爷们满意，所以。为了更好的服务用户给用户更加极致的浏览体验，我们需要利用嵌入字体来实现我们想要的效果！！！
一句话总结--所谓的嵌入字体，就是加载服务器端的字体文件，让浏览器端可以显示用户电脑里没有安装的字体。
<!DOCTYPE html>
<html >
<head>
<tiltle></title>
<style type="text/css">
/*定义字体*/
@font-face
{
font-family: myfont; /*定义字体名称为myfont*/
src: url("../font/Horst-Blackletter.ttf");/*路径，下载下来的用相对路径，网络上的用绝对路径*/
}
div
{
font-family:myfont; /*使用自定义的myfont字体作为div元素的字体类型*/
font-size:60px;
background-color:#ECE2D6;
color:#626C3D;
padding:20px;
}
</style>
</head>
<body>
<div>嵌入字体演示</div>
</body>
</html>
注意：@font-face嵌入字体最好使用在英文网站，中文站里的字体文件略大，从性能考虑使用不合适。影响网页的加载速度，中文站需要少量的特殊字体建议使用图片代替吧。
来源：https://www.cnblogs.com/milx/p/6246695.html