lcd样式应该怎么引入呢

Question

你好，（fontFamily: "wgsFont",//该字体是我自己引入的lcd字体，不知道怎么引入） 这个应该怎么引入呢

Answer 1

LCD字体在前端的实现

应项目需求需要实现如图效果(这也是实际效果图)，做一个方法总结：

具体实现步骤:

1、首先到https://www.dafont.com/theme.php?cat=302下载你需要的字体，它提供的字体很多不止有LCD字体一种。

==点击1：== 可以看到LCD字体下也有很多不同风格的

==点击2：== 下载，解压

2、打开https://www.fontsquirrel.com/tools/webfont-generator如图：

3、选择最右边的自定义配置，为了尽可能多的兼容各个浏览器，按照以下选择：

4、==点击最上面的upload fonts 上传==刚刚下载好(==自己所需==的那个)的TTF文件，==滑倒下方 点击我同意，然后开始下载==。
5、解压压缩包得到如下文件：

6、将此文件夹(整个文件夹)放入到对应的项目中的静态资源存放位置如 assets/font 文件夹下。
7、在你需要此字体的页面中的css中写入如下代码：

/* 引入lcd字体 */
@font-face {
  font-family: "wgsFont";
  src: url("../font/ds-digi-webfont.eot"); /* IE9 Compat Modes */
  src: url("../font/ds-digi-webfont.eot?#iefix") format("embedded-opentype"), /*IE6-IE8 */
    url("../font/ds-digi-webfont.woff") format("woff"),  /* Modern Browsers */
    url("../font/ds-digi-webfont.ttf") format("truetype"),  /* Safari, Android, iOS */
    url("../font/ds-digi-webfont.svg") format("svg");   /* Legacy iOS */
}

到此准备工作就完成了
代码中具体怎么用：（font-size，color，font-weight等都是可以正常使用的，只是字体增加了一种，当然字体名你可以在步骤7中自己起名字）