一、下载VS Code
首先从官网 https://code.visualstudio.com/下载VS Code 。
二、在VS Code中下载相关的插件
1、首先打开Visual Studio Code
2、点击左侧工具栏中“扩展”栏,也可使用扩展快捷键打开(Ctrl+Shift+X),打开扩展下载以下三个插件。(三个插件安装完成后都需要重启 VS Code才能使用)
-
- HTML Play (在你需要监听的html文件上按ctrl+alt+h使用,测试使用)
-
安装Chinese (Simplified)(简体中文)
安装 HTML Play
安装
安装完成后鼠标右键点击open in browser,点击“安装另一个版本”。
选择1.1.0版本的安装即可。
至此,三个插件安装流程已经完成。
3、接下来就是使用open in browser配置你编辑的html文件要在哪个浏览器上打开,依然是鼠标右键点击open in browser,然后选择“扩展设置”选项。
在文本框中填上一个你已经安装好的并使用顺手的浏览器,我这边使用的是Google Chrome。
填完之后重启一下Visual Studio Code就ok啦。
三、使用Visual Studio Code创建html文件
点击左上角工具栏中的文件,选择新建文件。
在文本框中输入html。
注意:要以html为后缀名,然后选择放置的位置就可以得到一个新的html文件。
四、html文件运行在浏览器上
在html文件中编辑代码。
代码附上:
<html><head><title>Hello World</title></head><body>Hello World!</body> </html>
代码输入完毕之后选择左上角“文件”,点击“保存”。也可用保存快捷键(Ctrl+S)进行保存。