在vue中的css中添加新字体

亦凉 2021-07-25 13:59 556阅读 0赞

下载字体：[https://www.fontke.com/][https_www.fontke.com]

字体转换器：[https://www.fontke.com/tool/convfont/][https_www.fontke.com_tool_convfont]

目录结构如下：

![20200314171430522.png][]

stheitisc.css:

@font-face {
      	font-family: 'STHeitiSC';     /* 这个名字可以自己定义 */
      	
    	src: url('./stheitisc.eot'); /* IE9 Compat Modes */      /*这里以及下面的src后面的地址填的都是自己本地的相对地址*/
      	src: url('./stheitisc.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
              url('./stheitisc.woff') format('woff'), /* Modern Browsers */
              url('./stheitisc.ttf')  format('truetype'), /* Safari, Android, iOS */
              url('./stheitisc.svg#AdobeHeitiStdR') format('svg'); /* Legacy iOS */
    		  font-weight: normal; 
    		  font-style: normal; 
      }

main.js中引入stheitisc.css

import '@/assets/myCSS/stheitisc.css'

使用字体：

font-family: "STHeitiSC";

[https_www.fontke.com]: https://www.fontke.com/
[https_www.fontke.com_tool_convfont]: https://www.fontke.com/tool/convfont/
[20200314171430522.png]: https://img-blog.csdnimg.cn/20200314171430522.png

发表评论取消回复

表情：

评论列表（有 0 条评论，556人围观）

还没有评论，来说两句吧...

相关阅读

相关如何在MongoDB中添加新用户

如何在MongoDB中添加新用户？ > MongoDB是一款流行的NoSQL数据库，它的可扩展性强，可进行分布式部署，且具有高可用性。其许多优势使得越来越多的企业和组织选

迷南。/ 2023年10月14日 16:16/ 0 赞/ 41 阅读

相关 Docker 容器中添加字体

在容器中转PDF时，可能是 JasperReport，可能是 Aspose，也可能是自己用 pdfbox, itex 之类的库。在 Windows 上可能运行的没有问题，但是切

一时失言乱红尘/ 2022年12月06日 04:24/ 0 赞/ 505 阅读

相关在CSS中使用字体真棒图标

本文翻译自：[Use Font Awesome Icons in CSS][] I have some CSS that looks like this: 我有一些看起来像这

「爱情、让人受尽委屈。」/ 2022年11月28日 10:35/ 0 赞/ 178 阅读

相关 vue中的过滤以及在vue打开新的标签页(vue中添加新的属性)

![在这里插入图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAbGl1bGFuZzY4_

素颜马尾好姑娘i/ 2022年09月10日 11:16/ 0 赞/ 376 阅读

相关 CSS中常用的字体单位

1、px px单位名称为像素，像素是固定大小的单元,用于屏幕媒体(即在电脑屏幕上读取)。一个像素等于电脑屏幕上的一个点 (是你屏幕分辨率的最小分割)。许多网页设计师在web文

柔光的暖阳◎/ 2022年06月08日 10:27/ 0 赞/ 265 阅读

相关 javafx 在fxml中添加css文件

在javafx项目的fxml文件中，以下面的格式: // stylesheets="@../ css文件所在包名 /css文件名" <GridPane st

阳光穿透心脏的1/2处/ 2022年03月26日 03:19/ 0 赞/ 696 阅读

相关 ARCH字体管理，添加新字体.

查看已安装字体 fc-list | less 搜索库里可用的字体 pacman -Ss ttf | less 找到要用的自体安装之，比如文泉忆

Bertha 。/ 2021年11月02日 03:16/ 0 赞/ 549 阅读

相关 Animate.css 在vue中的应用

官网：[http://www.animate.net.cn/][http_www.animate.net.cn] 在线演示：[https://www.dowebok.com/

喜欢ヅ旅行/ 2021年07月25日 17:03/ 0 赞/ 437 阅读

相关在vue中的css中添加新字体

下载字体：[https://www.fontke.com/][https_www.fontke.com] 字体转换器：[https://www.fontke.com/tool

亦凉/ 2021年07月25日 13:59/ 0 赞/ 557 阅读

相关 CSS中的字体与排版

1.连字符断行问题：两端对齐的效果的时候，折行效果有的时候真的很丑。解决：使用`hyphens`属性。 `hyphens` 告知浏览器在换行时如何使用连字符连接

逃离我推掉我的手/ 2021年06月26日 16:06/ 0 赞/ 463 阅读