【css】LCD液晶字体——自定义字体@font-face

实现效果：

实现步骤：

/theme.php?cat=302&text=0123456789

选择LCD，点download下载需要的字体文件(.ttf)。

生成eot/ woff等格式文件

/tools/webfont-generator

上传ttf文件，生成其他格式文件。

将字体文件放在一个文件夹中。

css中用@font-face定义字体

@font-face {font-family: 'font-lcd';// 字体名称src:url('./assets/font-lcd/ds-digi-webfont.eot');//iesrc: url('./assets/font-lcd/ds-digi-webfont.eot?#iefix') format('embedded-opentype'),url('./assets/font-lcd/ds-digi-webfont.woff') format('woff'),url("./assets/font-lcd/ds-digi-webfont.ttf") format('truetype'),url('./assets/font-lcd/ds-digi-webfont.svg#MicrosoftYaHei') format('svg');}//src: 字体文件路径

使用：

.test {font-family: 'font-lcd'; // 使用自定义字体color: red;}

如果觉得《【css】LCD液晶字体——自定义字体@font-face》对你有帮助，请点赞、收藏，并留下你的观点哦！