开发者社区> 水车306> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

WebStorm设置字体和颜色

简介: 新建Scheme + 修改字体 ctrl+alt+s打开Settings界面,Editor > Colors&Fonts > Font。 Default scheme是亮色调,但我想定制一套暗背景的环境,所以在右侧Scheme name下拉框中选择Monokai,以此作为修改的基础,然后点击Save as,给自己新建的Scheme起个名字吧,如下图: 这里面可以设置字体(我一般选择Consolas),字体大小,行间距。
+关注继续查看

新建Scheme + 修改字体

ctrl+alt+s打开Settings界面,Editor > Colors&Fonts > Font。

Default scheme是亮色调,但我想定制一套暗背景的环境,所以在右侧Scheme name下拉框中选择Monokai,以此作为修改的基础,然后点击Save as,给自己新建的Scheme起个名字吧,如下图:

font

这里面可以设置字体(我一般选择Consolas),字体大小,行间距。

 

自定义语法高亮

用ctrl+alt+s打开Settings界面,Editor > Colors&Fonts。

lang

不同语言有各自的语法高亮规则,但有一部分是通用的(General),我们首先来设置General,然后再根据需要设置不同语言的语法高亮。

General的设置

普通文本:default text

折叠文本: Folded text

光标: Caret

光标所在行: Caret row

行号: Line number

TODO: TODO default

光标下变量高亮:Search result

搜索结果:Text search result

匹配的括号:Matched brace

不匹配的括号:Unmatched brace

未使用的符号:Unused symbol

左边空隙(行号,断点):Gutter background

选中的文本背景色:Selection background

选中的文本前景色:Selection foreground

 

区分语言的设置

举例来说,如果要更改Javascript的语法高亮,就在上图中选择Javascript,然后再进行详细设置。具体设置项就不赘述了。

 

显示行号 + 自动换行

如果用Vim编程,行号是非常必要的辅助。WebStorm默认是不显示行号的,没关系,显示行号非常的容易。

只要在代码左侧的gutter区域点右键,就会出现下图的菜单:勾选上Show Line Numbers即可。

line number

另外,勾选上图中的Use Soft Wraps就启用了WebStorm的自动换行的功能,即过长的代码行不会超出屏幕,不会出现横向的滚动条。

值得一提的是,标准的Vim,jk是移到上一行下一行,如果代码自动换行了,被分割成的两行虽然看起来是两行,但其实是一个逻辑行,这时候用jk是上移下移一个逻辑行。这种情况下,如果要从同一逻辑行的“第一行”移动到“第二行”,需要按gj,即先按g再按方向。虽然Vim提供了这个方法,但还是经常按错。

好消息是,启用了Use Soft Wraps的WebStorm不需要这样,直接按j就可以从同一逻辑行的“第一行”移动到“第二行”。

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
sublime侧边栏字体、样式、边距修改
sublime侧边栏字体、样式、边距修改
0 0
PyQt5 技术篇-调用字体对话框(QFontDialog)获取字体,控件设置字体。
PyQt5 技术篇-调用字体对话框(QFontDialog)获取字体,控件设置字体。
0 0
Markdown设置字体大小、颜色...,CSDN博客编写设置字体大小、颜色、粗细。字体,文字背景设置。
Markdown设置字体大小、颜色...,CSDN博客编写设置字体大小、颜色、粗细。字体,文字背景设置。
0 0
markdown编辑器(颜色、大小、字体)
我是黑体字 我是微软雅黑 我是楷体 呈现效果 我是黑体字我是微软雅黑我是楷体 浏览器默认值是 3 颜色值 参考:CSDN-markdown编辑器语法——字体、字号与颜色
968 0
ObjectArx学习笔记-设置字体样式
实现代码: static void qxzyOperateLayer_AddStyle(void) { AcDbTextStyleTable *pTextStyleTbl; acdbHostApplicationServices()->workingDatabase() ->getTextStyleTable(pTextStyleTbl, AcDb::kFo
2257 0
TypeWonder – 在任何网站上实时预览字体效果
  TypeWonder 让网页字体的选择过程变得轻松愉快。它可以帮助您在任何网站上快速测试 Web 字体效果!输入网站网址,就能够即时预览的字体的实际效果,还可以从数百种字体中进行挑选,您还可以得到所需字体的代码,可以很方便的嵌入到您的网站。
690 0
+关注
水车306
笑看前端程序员写后端
文章
问答
文章排行榜
最热
最新
相关电子书
更多
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期:MySQL数据库进阶实战
立即下载