VSCode 使用教程：项目使用配置、使用哪些插件、Live Server使用问题及解决方案(你想要的，都在这里)

VSCode的配置：

Ⅰ、VSCode 可能需要的项目配置：
- 1、项目颜色主题的切换：
- - 其一、点击设置 -> 选择主题 -> 选择颜色主题：
  - 其二、通过上下键操作，选择想要的主题：
- 2、项目文件图标主题的切换：
- - 其一、点击设置 -> 选择主题 -> 选择文件图标主题：
  - 其二、通过上下键操作，选择想要的主题：
- 3、大纲和时间线的作用：
- - 其一、选择展示大纲和时间线的操作：
  - 其二、大纲的作用：
  - 其三、时间线的作用：
- 4、设置字体大小的操作：
- - 其一、设置全局的字体大小：
  - - A、点击设置 -> 选择设置;
    - B、输入字体并搜素：
  - 其二、设置 Ctrl + 滚轮可调整字体大小：
  - - A、点击设置 -> 选择设置;
    - B、输入字体并搜素：
- 5、设置代码自动保存的操作：
- - 其一、点击设置 -> 选择设置;
  - 其二、输入自动保存并搜素：
- 6、设置生成 html 标准属性值的操作：
- - 其一、点击设置 -> 选择设置;
  - 其二、设置在 html 标准中可以使用的 lang 属性值：
Ⅱ、VSCode可能需要的插件配置：
- 1、加载简体中文插件：
- 2、加载 vscode-icons 插件：
- 3、加载 Live Server 插件：
Ⅲ、VSCode配置 Live Server 插件可能遇到的问题：
- 1、打开文件时，Live Server 插件无法正常工作：
- 2、在浏览器上打开文件后，更改文件无法自动刷新：
Ⅳ、VSCode使用的细节问题：
- 1、双击打开文件与单击打开文件的区别：
- - 其一、双击打开文件：
  - 其二、单击打开文件：
Ⅴ、小结：

Ⅰ、VSCode 可能需要的项目配置：

1、项目颜色主题的切换：

其一、点击设置 -> 选择主题 -> 选择颜色主题：

在这里插入图片描述

其二、通过上下键操作，选择想要的主题：

// 默认是选择 Dark Modern 主题;

在这里插入图片描述

2、项目文件图标主题的切换：

其一、点击设置 -> 选择主题 -> 选择文件图标主题：

在这里插入图片描述

其二、通过上下键操作，选择想要的主题：

// 其中的 VSCode Icons 是通过安装插件而多的选项(安装该插件的操作下面有叙述);

在这里插入图片描述

3、大纲和时间线的作用：

其一、选择展示大纲和时间线的操作：

// 点击资源管理器的 …，然后不想展示哪个，就去掉大纲或时间线前面的对号即可;

在这里插入图片描述

其二、大纲的作用：

// 点击文件(如：03_HTML标签属性.html)后，再打开大纲，发现该文件中的 html 架构都能在大纲中看到;

在这里插入图片描述

其三、时间线的作用：

// 点击文件(如：03_HTML标签属性.html)后，再打开时间线，通过点击时间线中不同的已保存文件，可以看到现在的文件与之前有什么区别，修改了哪些内容;

在这里插入图片描述

4、设置字体大小的操作：

其一、设置全局的字体大小：

A、点击设置 -> 选择设置;

在这里插入图片描述

B、输入字体并搜素：

// 在 Editor: Font Size 属性下，输入字体大小即可(如：14 或 22);

在这里插入图片描述

其二、设置 Ctrl + 滚轮可调整字体大小：

A、点击设置 -> 选择设置;

在这里插入图片描述

B、输入字体并搜素：

// 在 Editor: Mouse Wheel Zoom 属性下，选中即可;

在这里插入图片描述

5、设置代码自动保存的操作：

其一、点击设置 -> 选择设置;

在这里插入图片描述

其二、输入自动保存并搜素：

// Files: Auto Save 属性中有四个属性值：
// off 表示：不自动保存;
// afterDelay 表示：该属性与 Files: Auto Save Delay 属性配合使用，表示写好代码后，延迟多少秒会自动保存;
// onFocusChange 表示：当文件信息修改后，只要切换成其它文件，上个文件的修改信息就会自动保存;
// onWindowChange 表示：当文件信息修改后，切换成其它 Windows 窗口后，该项目修改的文件都会自动保存;

// Files: Auto Save Delay 属性与 Files: Auto Save 属性的 afterDelay 配合使用：
// 单位是毫秒(ms)，即：写好代码后，延迟多少毫秒会自动保存;

在这里插入图片描述