当我们的代码量很多
我们会把一块一块的代码折叠起来

就像这样:

macos vscode 折叠python vscode如何折叠代码_css

我们只需要点击父盒子那一行左边的折叠按钮,就可以将整个父盒子这一块的代码进行折叠:

macos vscode 折叠python vscode如何折叠代码_css_02


然后当我们想在折叠的这段代码里做一些修改的时候,再把它打开就行了

平时这段代码不经常改动的时候就可以将这段代码折叠起来,这样每次上下滚动就不用再经过这一大块代码了。

html的代码可以按照他的结构层次进行折叠
但是CSS折叠的时候并不是这么理想

macos vscode 折叠python vscode如何折叠代码_javascript_03

它顶多就能这样:

macos vscode 折叠python vscode如何折叠代码_visual studio_04


如果它不能向我们希望的那样按照html的结构层次进行折叠的话,那这个折叠就没有什么意义了

如果我们可以自定义折叠代码的区域那就好了
当然VSCode是不会让我们失望的

好了废话说的差不多了开始本文的正题

自定义折叠代码区域的方法:

既然是一个区域,那就有开头结尾
我们只需要在
区域的开头写上:

/* #region */

区域的末尾写上:

/* #endregion */
然后就会发现这个位置

macos vscode 折叠python vscode如何折叠代码_javascript_05

出现了一个折叠代码的按钮,点它

macos vscode 折叠python vscode如何折叠代码_css_06


就可以将region和endregion中间的所有代码折叠起来了

这样就可以达到和html一样的折叠效果了

js代码也一样

macos vscode 折叠python vscode如何折叠代码_css_07


macos vscode 折叠python vscode如何折叠代码_css_08

C,C++,Java 这些也同理

macos vscode 折叠python vscode如何折叠代码_css_09

至于每个语言要怎么写这个东西,可以参考这张表↓

macos vscode 折叠python vscode如何折叠代码_自定义_10