三步教你设置网站字体为苹方

您所在的位置:网站首页 cad如何显示字体替换 三步教你设置网站字体为苹方

三步教你设置网站字体为苹方

2023-07-06 03:37| 来源: 网络整理| 查看: 265

看了很久还是觉得苹果的苹方字体最好看,所以今天教大家怎么把网站字体换成苹方,瞬间提高网站的观赏度。

使用教程 下载苹方ttf

网上苹方字体资源真难找啊,不是下载一堆没用的东西就是下载时需要付费。这里我就把自己现在用苹方SC分享出来,有其他好看的字体可以评论区分享出来。

链接:https://pan.baidu.com/s/1zdyhFAqtBVNpait9d4IONw?pwd=l60i

引用

这里以Vue3为示例,实际上换字体流程都大差不差。

在项目的asset目录下引入字体文件并且新建一个font.css文件。

在font.css里面添加下面代码引入字体文件。

@font-face { font-family: 'pingfang'; ##自定义的字体名字 src: url('PingFang SC.ttf'); ##引入的字体文件路径 font-weight: normal; font-style: normal; }

接着在全局引入App.vue引入字体文件,如果仅需在部分页面更改字体则在组件里面引用。

@import "./assets/font.css"; body{ font-family: pingfang; }

至此网站字体应该变成苹方了,可以进入我的网站看实际效果爱加班的小刘 (xiaoliu.life)。



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3