字体资源地址
FiraCode 和 Operator Mono 字体下载地址
一、效果
话不多说,先上图,看看效果是不是大家需要的,咱们再继续往下看:
JS
代码效果:
CSS
文件效果
HTML
文件效果
这里的白色背景主题是可以更换的,主要是字体,如果觉得我这个白色背景丑的,请不要在意这些细节,哈哈哈
二、设置字体
下载字体:
这里需要安装两种字体,由于 Operator Mono
需要建立在 Fira Code
字体的环境基础上,所以也要安装 Fira Code
字体,然后安装 Operator Mono
。
- Fira Code 字体下载地址:https://github.com/tonsky/FiraCode
- Operator Mono 字体下载地址:https://www.typography.com/fonts/operator/styles
- 可在我的 GitHub 上直接下载:https://github.com/beichensky/Font
在电脑上安装对应的字体
下面是在 Mac 上如何安装字体的图文,若需要在 windows 上安装,请自行查看字体安装的方式。
按住 cmd + space
,搜索“字体册”,然后打开:
点击 + 号,在弹窗中选中字体所在的文件夹,然后确定即可:
三、在 VSCode
中添加字体设置
在 vscode 的设置中添加以下配置:
"editor.fontFamily": "Operator Mono",
"editor.fontLigatures": true, // 这个控制是否启用字体连字,true启用,false不启用,这里选择启用
"editor.tokenColorCustomizations": {
"textMateRules": [
{
"name": "italic font",
"scope": [
"comment",
"keyword",
"storage",
"keyword.control.import",
"keyword.control.default",
"keyword.control.from",
"keyword.operator.new",
"keyword.control.export",
"keyword.control.flow",
"storage.type.class",
"storage.type.function",
"storage.type",
"storage.type.class",
"variable.language",
"variable.language.super",
"variable.language.this",
"meta.class",
"meta.var.expr",
"constant.language.null",
"support.type.primitive",
"entity.name.method.js",
"entity.other.attribute-name",
"punctuation.definition.comment",
"text.html.basic entity.other.attribute-name.html",
"text.html.basic entity.other.attribute-name",
"tag.decorator.js entity.name.tag.js",
"tag.decorator.js punctuation.definition.tag.js",
"source.js constant.other.object.key.js string.unquoted.label.js",
],
"settings": {
"fontStyle": "italic",
}
},
]
}
重启 VSCode,即可看到配置生效,字体变成了好看的连体字。
今天的文章为VSCode 设置好看的字体:Operator Mono分享到此就结束了,感谢您的阅读。
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
如需转载请保留出处:https://bianchenghao.cn/11713.html