更改 Visual Studio Code 的选项卡栏颜色

Aay*_*tal 8 configuration themes visual-studio-code

有没有办法在 VS Code 中配置选项卡栏的背景颜色?我知道有一个设置允许使用 VS Code文件workBench.colorCustomization更改主题颜色;settings.json是否可以使用该设置更改它?

标签栏

JΛY*_*ÐΞV 16


\n

要设置上述问题所描述的编辑器区域的样式,请使用下面显示的属性。

\n

"editorGroupHeader.tabsBackground": "#00FF00"

\n
\n
\n
\n

似乎有些人很困惑如何让属性主动改变属性负责的区域的颜色,所以我在下面添加了 2 个如何正确使用VS Code Color-Token theme-properties 的示例。有两个例子,因为有两种使用方法。第一个显示在这里。

\n
\n
\n

1.\xc2\xa0 在主题中使用属性

\n
\n
下面显示了如何使用为问题作者描述的区域着色的属性。作者特别要求提供背景,但我包含了负责为该区域着色的所有三个属性。此示例演示如何使用主题为 VS Code 编辑器着色。
\n
\n// Using the property in a VSCode Theme:\n\n// FILE (Linux):\n// $HOME/.vscode/extensions/${theme}/themes/${theme}.json\n\n\n// FILE (Windows 10)\n// C:\\Users\\${uid}\\.vscode\\extensions\\${theme}\\themes\\${theme}.json\n  \n\n{\n    "$schema": "vscode://schemas/color-theme",\n    "id": "developers-dojo",\n    "type": "dark",\n    "colors": {\n        "editorGroupHeader.tabsBackground": "#021331",\n        "editorGroupHeader.tabsBorder": "#00FF4040",\n        "editorGroupHeader.border": "#000000D0",\n    }\n}\n\n
Run Code Online (Sandbox Code Playgroud)\n
\n
\n
\n

settings.json2. 使用文件中的属性

\n
\n

使用该属性为VS Code 编辑器editorGroupHeader.tabsBackground着色的最简单方法是简单地将属性键入到您的文件或工作区的文件中。请记住,这是一个属于一组颜色标记的属性,该组颜色标记的定义位置与设置属性的定义位置不同,因此,如果您只是将其添加到文件中,您会发现该属性不起作用方式。您需要使用特殊配置JSON -Property来包装您要使用的颜色属性。如果将下面的代码片段添加到文件中,您将更改选项卡组区域的颜色。setting.json./.vscode/settings.jsonsettings.jsonworkbench.colorCustomizationssettings.json

\n
\n
\n// Use in either your user's "settings.json" file\n// Or in your work-space's "./.vscode/settings.json" file\n\n{\n  "workbench.colorCustomizations": {\n    "editorGroupHeader.tabsBackground": "#0000FF",\n    "editorGroupHeader.tabsBorder": "#0F6C8C",\n    "editorGroupHeader.border": "#FF5010",\n  }\n}\n\n\n
Run Code Online (Sandbox Code Playgroud)\n
\n
\n