精华内容
下载资源
问答
  • VScode主题设置

    千次阅读 2020-03-13 15:10:56
    或者点击“file”,“preferences”,如果有的人已经汉化了的话,操作是“文件”,“首选项”,在preferences选项下面找到“color theme”,也就是我们中文版的“颜色主题”。 最爱Monokai主题配色。 ...

    快捷键: 键盘组合键ctrl+K,ctrl+T。

    或者点击“file”,“preferences”,如果有的人已经汉化了的话,操作是“文件”,“首选项”,在preferences选项下面找到“color theme”,也就是我们中文版的“颜色主题”。

    最爱Monokai主题配色。

    展开全文
  • 主题设置 点击菜单栏的「Code」——「首选项」——「设置」,然后在左边找到「工作台」——「外观」,在「Color Theme」选项下可以设置主题,下面以「Default Dark+」主题为例,讲解如何在这个主题的基础上...

    主题设置

    • 点击菜单栏的「Code」——「首选项」——「设置」,然后在左边找到「工作台」——「外观」,在「Color Theme」选项下可以设置主题,下面以「Default Dark+」主题为例,讲解如何在这个主题的基础上自定义一些地方的设置

    • /Applications/Visual Studio Code.app/Contents/Resources/app/extensions 路径下找到 theme-defaults文件夹,再打开里面的 themes 文件夹,然后打开 dark_defaults.json 文件,文件内容如下(部分内容我已根据自己的喜欢更改,并且添加了一些内容;鼠标放在每一行上,会有中文提示这一行设置的是什么;要更改其它主题的设置也是类似的方法)

      {
      	"$schema": "vscode://schemas/color-theme",
      	"name": "Dark Default Colors",
      	// 里面很多设置是我改动过后的
      	"colors": {
      		"editor.background": "#000000", 
      		"editor.foreground": "#FFFFFF",
      		"activityBar.background": "#000000", // 活动栏背景色(自己加的)
      		"activityBar.foreground": "#FFFFFF", // 活动栏前景色(自己加的)
      		"editor.inactiveSelectionBackground": "#3A3D41",
      		"editorIndentGuide.background": "#404040",
      		"editorIndentGuide.activeBackground": "#707070",
      		"editor.selectionHighlightBackground": "#ADD6FF26",
      		"list.dropBackground": "#383B3D",
      		"activityBarBadge.background": "#007ACC",
      		"sideBarTitle.foreground": "#FFFFFF",
      		"sideBar.background": "#000000", // 侧边栏背景色(自己改动过)
      		"sideBar.foreground": "#FFFFFF", // 侧边栏前景色(自己改动过)
      		"input.placeholderForeground": "#A6A6A6",
      		"settings.textInputBackground": "#000000",
      		"settings.numberInputBackground": "#292929",
      		"menu.background": "#000000",
      		"menu.foreground": "#C7C7C7",
      		"statusBarItem.remoteForeground": "#FFF",
      		"statusBarItem.remoteBackground": "#16825D"
      	}
      }
      
    • 要想改变状态栏的颜色,我们需要在 settings.json 文件里进行设置

      1. 点击菜单栏的「Code」——「首选项」——「设置」,然后在左边找到「工作台」——「外观」,然后打开 settings.json 文件
        在这里插入图片描述

      2. 然后在最后添加如下内容(具体的值可以根据自己的喜好自定义;注意还要在上一条语句中加个逗号)

        "workbench.colorCustomizations": {
            "statusBar.background" : "#000000",
            "statusBar.foreground" : "#FFFFFF",
            "statusBar.noFolderBackground" : "#0A0A0D",
            "statusBar.debuggingBackground": "#511f1f"
        }
        
      3. 保存后,重启软件,设置即可生效

    • 要想改变某个主题下的光标所在行的背景色,我们需要在对应的主题的配置文件的 colors 下添加 "editor.lineHighlightBackground": "#FFFAE3",

    • 要想改变编辑器活动行号的颜色,我们需要在对应的主题的配置文件的 colors 下添加 "editorLineNumber.activeForeground": "#FF0000",
      在这里插入图片描述

      Tips:不知道某个设置该怎么写时,可以去其它主题的配置文件中寻找有没有我们想要的

    • 要更改每个文件显示的图标,可以在扩展商店中搜索 tag:icon-theme,然后安装自己喜欢的文件图标扩展包
      在这里插入图片描述

    常用快捷键

    1. 打开「输出/终端」:command + J
      在这里插入图片描述

    2. 关闭或打开「侧边栏」:command + B
      在这里插入图片描述

    3. 显示或隐藏「活动栏」:「查看」——「外观」——「隐藏活动栏」
      在这里插入图片描述

    4. 显示或隐藏底部的「状态栏」:「查看」——「外观」——「隐藏状态栏」
      在这里插入图片描述

    5. 控制侧边栏显示的条目:鼠标放在侧边栏的某个条目上,点击右键即可看到关闭选项
      在这里插入图片描述

    6. 关闭打开的文件夹:「文件」——「 关闭文件夹 [⌘K F] 」,也可使用快捷键,先按下 [⌘K,然后松开,再按下 F
      在这里插入图片描述
      在这里插入图片描述

    7. 切换侧边栏显示的内容(侧边栏可以显示很多内容,如资源管理器等):点击菜单栏的「查看」

    在这里插入图片描述

    1. 向 上/下 移动一行:⌥ + ⬆️/ ⬇️(Alt+Up 或 Alt+Down)

    2. 向 上/下 复制一行: ⇧ + ⌥ + ⬆️/ ⬇️(Shift+Alt+Up 或 Shift+Alt+Down)

    展开全文
  • 【1】VScode中文界面方法-------超简单教程 【2】VScode搭建python和tensorflow环境 【3】VSCode 主题设置推荐,自定义配色方案,修改注释高亮颜色 【4】VScode最全面最实用的插件推荐,用了你就爱上了! 【5】...

    相关文章:


    VSCode 主题设置推荐,自定义配色方案,修改注释高亮颜色

    设置主题:

    个人比较忠爱vscode的界面,感觉比pycharm要更美观点,虽然两个都装了,但还是会习惯性打开vscode进行调试。下面是我使用的主题。

     

    或者在设置--外观里面进行细致设置

    vscode官网:https://marketplace.visualstudio.com/search?target=VSCode&category=Themes&sortBy=Installs,大家可以选择自己喜欢的主题

    主题推荐

    • One Dark Pro:

    https://marketplace.visualstudio.com/items?itemName=zhuangtongfa.Material-theme

    最新版本3.10.12 2021.4.10更新,下载量还是很多的,也很不错几面清新舒适

    ScreenShot

     

    • Palenight Theme

    https://marketplace.visualstudio.com/items?itemName=whizkydee.material-palenight-theme

    2.0.1最新更新版本2020.9.21,界面比较有个性。

     

    • Monokai Pro

    https://marketplace.visualstudio.com/items?itemName=monokai.theme-monokai-pro-vscode

    VersionLast Updated 
    1.1.192021/4/6
    • Dracula Official

    https://marketplace.visualstudio.com/items?itemName=dracula-theme.theme-dracula

    VersionLast Updated 
    2.22.32020/11/24

    暗紫色的色调是这个主题与其他主题与众不同的地方。我很喜欢!!

    • One Monokai Theme

    https://marketplace.visualstudio.com/items?itemName=azemoh.one-monokai

    多彩的主题! 很多颜色,无处不在

    VersionLast Updated 
    0.5.02020/10/16
    • Material Theme

    https://marketplace.visualstudio.com/items?itemName=Equinusocio.vsc-material-theme

    VersionLast Updated 
    33.2.22021/3/15

    干净简约。

    • Panda Theme

    https://marketplace.visualstudio.com/items?itemName=tinkertrain.theme-panda

    VersionLast Updated 
    1.3.02018/6/30

    自定义配色方案

    首先进入安装vscode目录找到想要修改调整的主题,以我的文件路径为例:H:\VScode\Microsoft VS Code\resources\app\extensions,主题配置文件都位于resources/app/extensions目录中,以theme-开头的目录即为颜色主题配置:

     

    每个颜色主题配置目录包含以下文件:其中package.json我们可以用来配色方案。

    打开

    {"name":"theme-monokai","displayName":"%displayName%",
    "description":"%description%","version":"1.0.0",
    "publisher":"vscode",
    "license":"MIT","engines":{"vscode":"*"},
    "contributes":{"themes":[{"id":"Monokai","label":"%themeLabel%",
    "uiTheme":"vs-dark","path":"./themes/monokai-color-theme.json"}]},
    "repository":{"type":"git","url":"https://github.com/microsoft/vscode.git"}}
    参数名作用
    name主题ID,必需在VSCode中全局唯一,即所有主题的package.json中该值均不能重复
    contributes -> themes -> label主题名,“文件-首选项-颜色主题”的列表中显示该值
    contributes -> themes -> uiThemeVSCode整体的UI主题,vs为浅色主题
    contributes -> themes -> path定义配色方案的文件名,如为相对路径则相对于此文件

    再打开themes文件夹下monokai-color-theme.json进行配置。

    参数名作用
    colorsVSCode各个UI组件的颜色
    tokenColors语法高亮颜色

    colors节点的内容直接通过键值对参数描述,

    以下列举几个参数的作用:

    图示参数名作用
    2activityBar.background活动栏背景色
    1activityBar.foreground活动栏前景色(例如用于图标)
    12editor.background编辑器背景颜色
    13editor.foreground编辑器默认前景色
     editor.findMatchBackground当前搜索匹配项的颜色
     editor.findMatchHighlightBackground其他搜索匹配项的颜色
    15editor.lineHighlightBackground光标所在行高亮文本的背景颜色
     editor.selectionBackground编辑器所选内容的颜色
     editor.selectionHighlightBackground与所选内容具有相同内容的区域颜色
     editor.rangeHighlightBackground突出显示范围的背景颜色,例如 "Quick Open" 和“查找”功能
    16editorBracketMatch.background匹配括号的背景色
    14editorCursor.foreground编辑器光标颜色
    11editorGutter.background编辑器导航线的背景色,导航线包括边缘符号和行号
    10editorLineNumber.foreground编辑器行号颜色
    5sideBar.background侧边栏背景色
    4sideBar.foreground侧边栏前景色
    3sideBarSectionHeader.background侧边栏节标题的背景颜色
    17statusBar.background标准状态栏背景色
    17statusBar.noFolderBackground没有打开文件夹时状态栏的背景色
    17statusBar.debuggingBackground调试程序时状态栏的背景色
    9tab.activeBackground活动选项卡的背景色
    8tab.activeForeground活动组中活动选项卡的前景色
    7tab.inactiveBackground非活动选项卡的背景色
    6tab.inactiveForeground活动组中非活动选项卡的前景色

    tokenColors

    tokenColors使用一个对象数组描述各语法高亮颜色。每个对象有如下结构:

    {
        "name": "Comment",
        "scope": [
            "comment",
            "punctuation.definition.comment"
        ],
        "settings": {
            "background": "#ffffff",
            "fontStyle": "italic",
            "foreground": "#000000"
        }
    }
    参数名作用
    name规则描述,一段容易理解的描述性文字
    scope作用域,指定使用那些VSCode内部对象,其含义参看Scope Naming
    setting -> background背景色,可选
    setting -> fontStyle字体,可选,为bold、italic、underline
    setting -> foreground前景色,可选

    以下列举文末的配置文件中几个name所指定的参数的作用:

    参数名作用
    Character字符
    Class类名
    Comment注释
    Function函数名
    Keyword关键字
    Number数值
    Operator运算符
    Parameter函数参数
    Punctuation标点符号
    String字符串
    Type内置类型
    Variable变量名

    参考链接:https://blog.csdn.net/weixin_30755393/article/details/98661143 

    具体文件内容我就不贴了,改改颜色和高亮很简单的。

    颜色:网址提供:

    https://www.5tu.cn/colors/yansezhongwenming.html

    可以根据自己的喜好进行调整

    修改注释高亮颜色

    下面我们将进行选择时显示高亮和注释颜色修改,首先打开settings.json文件

    选择高亮:

    在setting.json中添加如下字段即可,颜色可以自定义修改【参考上面我提供的颜色网址

        "workbench.colorCustomizations": {
            "editor.selectionBackground": "#e46bc9",
            "editor.selectionHighlightBackground": "#a32c3c"
            },

    修改注释

    修改注释颜色,同样在setting.json中添加:

            "editor.tokenColorCustomizations": {
                "comments": "#3CB371"  //春天绿
            },

    效果图如下:选择时会高亮,注释我更喜欢淡紫色

     

     

    展开全文
  • vscode主题 设置 git clone https://github.com/orta/vscode-themes.git cd vscode-themes yarn install yarn setup 这将设置并运行预计大约需要2-3个小时。 确保您已设置VS Code Insiders等。 或者,如果您将其...
  • vscode主题颜色 - 设置

    千次阅读 2020-07-22 15:46:22
    vscode主题颜色(一键搞定) 设置步骤 · 依次操作 组合键: Ctrl+K Ctrl+T ...在弹出的界面(如下图),左键单击 选中,即可设置生效!...以上就是关于“ vscode主题颜色 - 设置篇 ” 的全部内容。 ...

    vscode主题颜色(一键搞定)


    设置步骤 · 依次操作 组合键

    • Ctrl+K

    • Ctrl+T

    • 在弹出的界面(如下图),左键单击 选中,即可设置生效!

    在这里插入图片描述


    以上就是关于“ vscode主题颜色 - 设置篇 ” 的全部内容。

    展开全文
  • VScode设置个性主题

    2021-07-03 11:27:20
    ctrl + shift + p进入命令面板 >preferences:Color Theme 选择喜欢的主题之后回车即可 当然现在有更简便的方法: 更多参考文章: VSCode颜色主题自定义 VSCode自定义配色方案
  • VSCode 常用设置

    2019-05-05 17:58:44
    VSCode 常用设置我使用的主题界面图标字体通用插件Unity 插件 我使用的主题 界面 吸血鬼主题:Dracula Official 图标 Material Icon Theme 字体 Fira Code,具体可见vscode中修改字体,使用Fira Code 通用插件 Unity ...
  • VSCODE设置绿豆沙主题

    千次阅读 2019-08-23 09:48:58
    由于个人习惯了VScode代码开发工具,而且开发环境是不能联网的,之前设置的eclipse都是绿豆沙背景,一直想将vscode设置成绿豆沙护眼主题,现在终于设置成功了,总结一下: 1. 下载绿豆沙离线主题包:...
  • VSCode 常用设置

    2020-07-09 14:23:55
    // VScode主题配置 "editor.tabSize": 2, "editor.lineHeight": 24, "editor.renderLineHighlight": "none", "editor.renderWhitespace": "none", "editor.fontFamily": "Consolas", "editor.fontSize": 15, ...
  • 左键单击文件–首选项–设置–点击标记的按钮 setting.json文件代码如下(直接复制进去保存就可): `{ “workbench.iconTheme”: “vscode-icons”, “files.associations”: { “.cjson": “jsonc”, ".wxss”: ...
  • VScode常用设置

    2021-05-10 23:30:01
    文章目录一、修改默认主题二、自动换行三、ssh连接到远程主机`3.1.安装Remote-SSH插件``3.2.创建一个远程连接``3.3.连接远程主机`三、修改默认删除行的快捷键为Ctrl+D 一、修改默认主题 Ctrl+k+T 选择一个自己喜欢...
  • 还有几款,各取所需: 但是 vscode-icons 安装后项目文件看起来太花里胡哨了 这个也还可以吧。
  • VScode设置操作

    2020-07-23 18:48:12
    vscode设置 1、 关于在vscode中添加vue的template { // Place your snippets for html here. Each snippet is defined under a snippet name and has a prefix, body and // description. The prefix is what ...
  • VScode用户设置Visual Studio Code

    千次阅读 2019-04-09 10:11:20
    推荐的Visual Studio Code用户设置 推荐的VScode用户设置 VUE3+TypeScript
  • VSCode沙绿色主题设置

    千次阅读 2019-06-21 15:09:05
    之前一直用sublime text3,最近装了vscode设置一款同样的沙绿色主题,所以有了这篇文章 主要参看这篇文章进行设置:https://blog.csdn.net/Lean_on_Me/article/details/84552487 内容大同小异,只是我自己又按自己...
  • ctrl + k; ctrl + T;
  • VScode主题色更换

    2021-07-29 16:01:35
    最新版VScode主题色更换,让你拥有属于自己的颜色
  • vscode默认设置

    千次阅读 2020-04-19 22:58:04
    默认设置(json),是defaultSettings.json文件 { // 启用后,差异编辑器将忽略前导空格或尾随空格中的更改。 "diffEditor.ignoreTrimWhitespace": true, // 超时(以毫秒为单位),之后将取消差异计算。使用0...
  • vscode-theme-onedark:基于Atom的One Dark主题的VSCode主题
  • 工具 - VSCode - 主题设置

    千次阅读 2019-02-11 12:06:58
    主题设置: File - Preferences - Color Theme
  • VSCode设置缩进

    2021-01-05 10:26:46
    VSCode默认缩进是4个空格,在编写代码时,这个缩进会造成代码过长,不便于修改和观看。 下面用一张图来看修改过程。 汉化版 未汉化版
  • vscode主题安装

    千次阅读 2019-09-22 21:13:15
    安装主题 快捷键Ctrl Shift X打开安装插件 ...扩展插件vscode-icon 鼠标滚轮设置字体大小 打开setting.json文件 修改setting.json,追加"editor.mouseWheelZoom": true { "editor.fontSize": 16, "workben...
  • 1.vscode-icons设置 步骤:文件->首选项->文件图标主题->vscode-icons 参考:VsCode插件之vscode-icons 2.c_cpp_properties.json设置 插件:C/C++ 生成c_cpp_properties.json文件 步骤:ctrl+...
  • ubuntu 18.04 VSCode沙绿色主题设置 完全参考大佬的链接: VSCode沙绿色主题设置 我在这一步需要点 ins 键才可以编辑settings.json,不清楚为什么。 代码如下: { "workbench.colorTheme": "Atom One Light", ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 4,943
精华内容 1,977
关键字:

vscode主题设置