VSCode 中如何让自定义 CSS 属性在浏览器控制台中显示色块？

大家好，今天本人给大家带来文章《VSCode 中如何让自定义 CSS 属性在浏览器控制台中显示色块？ 》，文中内容主要涉及到，如果你对文章方面的知识点感兴趣，那就请各位朋友继续看下去吧~希望能真正帮到你们，谢谢！

如何在 VSCode 中为自定义 CSS 属性显示色块

在浏览器控制台中，自定义 CSS 属性通常会在其名称前面显示一个色块，以便更容易识别和调试。然而，在 VSCode 中，这些色块可能不会显示。以下是解决此问题的方法：

使用 CSS Variable Autocomplete 扩展

安装 CSS Variable Autocomplete 扩展。此扩展将向 VSCode 添加一些功能，包括为自定义 CSS 属性显示色块。

安装扩展

1. 打开 VSCode 并点击左侧边栏中的“扩展”图标。
2. 在搜索栏中输入“CSS Variable”，然后单击 Enter 键。
3. 找到 CSS Variable Autocomplete 扩展并单击“安装”按钮。

配置扩展

安装扩展后，需要对编辑器的设置进行一些更改才能使色块显示。

1. 打开“设置”面板（命令面板：Ctrl+Shift+P -> 设置）。
2. 在搜索栏中输入“css.warnUnknownVariables”。
3. 将此设置的值更改为“style”。
4. 保存设置。

启用色块

完成这些步骤后，自定义 CSS 属性的名称前面现在应该会出现色块。

效果图：

好了，本文到此结束，带大家了解了《VSCode 中如何让自定义 CSS 属性在浏览器控制台中显示色块？ 》，希望本文对你有所帮助！关注golang学习网公众号，给大家分享更多文章知识！