VScode基本使用教程
安装教程
鼠标左键双击，即可运行安装程序
一：同意协议
二：选择安装路径
很明显可以看到VSCode的默认安装路径为C:\users\用户名\AppData\Local\Programs\Microsoft VS Code
你可以对其进行修改：
- 点击浏览按钮
- 或者 直接在输入框中删掉默认路径，然后进行填写（注意：请使用英文输入法）
三：在开始菜单文件夹中创建VSCode的快捷方式
- 你可以选择更改开始菜单文件夹名字
- 或者不创建开始菜单文件夹
- 这一步无论你如何选择，实际上几乎不影响你使用VS Code
开始菜单文件夹就是：
安装完成后，键盘上点击 win ，你会明白的
四：一些很有用的设置
这些选项勾选后的效果如下：
- **效果一：**创建桌面快捷方式
桌面上将出现该VSCode的快捷方式
- **效果二：**将“通过Code打开”操作添加到 Windows 资源管理器文件上下文菜单
选中任意文件，点击鼠标右键
可以直接通过VSCode打开该文件
- **效果三：**将“通过Code打开”操作添加到 Windows 资源管理器目录上下文菜单
选中任意文件夹，点击鼠标右键
可以直接通过VSCode打开该文件夹
将VS Code的打开操作添加到文件、文件夹的右键菜单中，会给我们的操作带来极大的方便
- **效果四：**将Code注册为受支持的文件类型的编辑器
对于受支持文件类型的文件，可以右键 > 打开方式 > Visual Studio Code
来用VSCode打开该文件
- **效果五：**添加到PATH
将VSCode添加到环境变量Path中，可以在控制台（cmd或power shell）中输入code打开VS Code
或者输入
code .将会在VSCode中打开该文件夹（控制台中显示的路径）
五：等待安装完成
六：安装完成
选择是否立即打开VS Code
使用教程
1、创建一个空文件夹，作为项目目录
2、打开vscode，在文件中选择【打开文件夹】，当然，我们也可以直接将文件夹拖进vscode编辑器
3、在左侧的“资源管理器”能看见我们的项目文件夹，右键它，新建一个html文档
4、我们输入半角感叹号 ! ，接着按下tab键，它将自动生成一个html结构
5、可以在body里编写我们自己的代码
安装插件
VSCode汉化
常用插件(安装步骤同汉化)
- 文件>首选项>设置>搜索Word Wrap,然后将off改为on（控制折行方式）
- Auto Close Tag (自动闭合HTML/XML标签)
- Auto Rename Tag (自动完成另一侧标签的同步修改)
- Beautify (格式化 html ,js,css)
- Bracket Pair Colorizer(给括号加上不同的颜色，便于区分不同的区块)
- Class autocomplete for HTML(智能提示HTML class =“”属性)
- Class autocomplete for HTML(智能提示HTML class =“”属性)
- HTML CSS Support (智能提示CSS类名以及id)
- HTML Snippets(智能提示HTML标签，以及标签含义)
- htmltagwrap(为选中内容自动添加标签，默认添加p标签，快捷键：Alt+w)
- htmltagwrap(为选中内容自动添加标签，默认添加p标签，快捷键：Alt+w)
- ellisense(自动提示文件路径)
- JS-CSS-HTML Formatter（保存文件是自动对文本进行格式化
- Live Server（VSCode文件保存，浏览器中页面会紧跟着更新）
- open in browser(右键快速在浏览器中打开html文件)
- Path Intellisense(自动提示文件路径)
常用快捷键
ctrl+n 新建文件
ctrl+z 回退
ctrl+y 撤销回退
ctrl+a 全选
shift+end 从头选中一行
shift+home 从尾部选中一行
shift+alt+↓ 向下复制
alt+上下键 快速移动
ctrl+x 删除/剪切
tab 缩进
shift+tab键 向前缩进
