webstorm 怎么调页面布局

如题所述

第1个回答  2017-04-05
新建Scheme + 修改字体
ctrl+alt+s打开Settings界面,Editor > Colors&Fonts > Font。
Default scheme是亮色调,但我想定制一套暗背景的环境,所以在右侧Scheme name下拉框中选择Monokai,以此作为修改的基础,然后点击Save as,给自己新建的Scheme起个名字吧,如下图:

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

自定义语法高亮
用ctrl+alt+s打开Settings界面,Editor > Colors&Fonts。

不同语言有各自的语法高亮规则,但有一部分是通用的(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即可。

另外,勾选上图中的Use Soft Wraps就启用了WebStorm的自动换行的功能,即过长的代码行不会超出屏幕,不会出现横向的滚动条。
值得一提的是,标准的Vim,jk是移到上一行下一行,如果代码自动换行了,被分割成的两行虽然看起来是两行,但其实是一个逻辑行,这时候用jk是上移下移一个逻辑行。这种情况下,如果要从同一逻辑行的“第一行”移动到“第二行”,需要按gj,即先按g再按方向。虽然Vim提供了这个方法,但还是经常按错。
好消息是,启用了Use Soft Wraps的WebStorm不需要这样,直接按j就可以从同一逻辑行的“第一行”移动到“第二行”。

导入导出设置
File > Export Settings导出用户设置。如下图,你可以选择要导出哪些类型的设置,也可以选择导出到哪个目录下。

导出后的配置以jar包的形式存在,导入也同样简单,File > Import Settings,选择jar包导入成功后,重启WebStorm就大功告成了。

webstorm 怎么调页面布局
新建Scheme + 修改字体 ctrl+alt+s打开Settings界面,Editor > Colors&Fonts > Font。Default scheme是亮色调,但我想定制一套暗背景的环境,所以在右侧Scheme name下拉框中选择Monokai,以此作为修改的基础,然后点击Save as,给自己新建的Scheme起个名字吧,如下图:这里面可以设置字体(我一般选择Consola...

webstorm字体太大无法完全显示页面怎么办
调整设置,重启WebStorm等。1、打开WebStorm软件,点击左上角的File选项,在弹出的菜单中选择Setting选项。在设置界面中,找到Appearance&Behavior选项,点击Appearance选项。在右侧的Font选项中,找到编码界面上的字体大小设置,将size的数值改为其需要的数字,包括20。2、上述方法无法解决问题,可以重启WebStorm...

【教程】【日常】【笔记】webstorm 模板设置。
首先,打开 webstorm ,复制你每次重复构建的模板, 然后打开偏好设置,快捷键 command+,(win 是 setting)在搜索栏输入 live 打开 live templates html\/xml 中添加模板 右手边加号。模板内容区域粘贴,缩写写你想要的,这里是 jq,最后选择应用场景,全选。应用 ok 检测,删除页面内容 打入 jq 按下 ...

WebStorm的页面怎样在浏览器中预览效果
手机版 我的知道 WebStorm的页面怎样在浏览器中预览效果 搜索资料 我来答 分享 微信扫一扫 网络繁忙请稍后重试 新浪微博 QQ空间 举报 本地图片 图片链接 代码 提交回答 匿名 回答自动保存中为你推荐:特别推荐《流浪地球》里的地下城已经建了不少 震惊!90后人均负债12万? 没有战斗的《黑暗之魂》是什么...

webstorm如何分屏?
具体使用方法如图所示:鼠标右键最上面的页面,选择方框中的选项即可进行分屏!

webstorm设置问题,必须重新打开页面才能更新代码,如何设置,才能恢复...
很简单,File-->Settings-->Editor-->Colors & Fonts-->General Scheme name选择Default,这些操作都是很简单的。这些东西我是从后盾人平台那里学来的。你有兴趣的话也可以去看一看,以后就从那里找答案吧。

WebStorm的页面怎样在浏览器中预览效果
1:File>Setting>tools>web browsers如图所示:2:可以看到webstrom原生的有默认的几个浏览器。如果安装了也可以直接在运行界面的右上角直接点击,或者按alt+f2出现选择框再点击。3:在File>Setting>tools>web browsers这个界面可以看到在path路径这里点击左键出现如图,输入自己想要的浏览器的运行文件的路径...

Web前端开发的利器 —— Webstorm
使用Webstorm时,建议电脑配置一定高,内存至少8G以上,CPU Intel i5以上,否则会影响开发效率。如果前端项目规模大(二十个页面以上),需要长期代码重构,请使用Webstorm而不是VSCode。为了工作效率与稳定性,请优先考虑使用Ultimate(最终)版本,不建议使用Community Edition(社区)版本。支持正版软件。

使用WebStorm如何调试Vue代码
在WebStorm中打开想要调试的Vue文件。在代码行左侧点击,设置断点。当代码执行到断点时,会暂停,允许查看和修改变量值、调用栈等信息。点击WebStorm右上角的绿色虫子图标(或使用快捷键Shift+F9)启动调试会话。此时,浏览器会自动打开并加载Vue项目。当代码执行到断点时,会暂停,调试视图会显示当前调用栈...

WebStorm的页面怎样在浏览器中预览效果
WebStorm软件的右上角有一个显示当前文件名称的部分,后面紧挨着的一个绿色三角形,点击绿色三角就可以在浏览器中显示页面,或者按下提示的Shift+F10快捷键。还有一个更直观的方法,我们将鼠标悬停到文件编辑区域的右上角,会浮现出几个主流浏览器的图标,有些我们电脑上并没有安装,只要随意点击电脑上...

相似回答