对于前端开发者来说，一个好的开发工具往往能够事半功倍。比较常见的网页开发工具有Dreamweaver、Sublime、WebStorm、HBuilder、VSCode。看到这么多开发工具，是不是脑袋都要大了？不要担心，我们只需要掌握一款实用性最高的工具即可。而且这些开发工具基本使用方式类似，掌握一款其他的即可触类旁通。
在开始网页开发工具VSCode安装之前，先给大家推荐几套零基础教程看看。
Html5+Css3+移动Web_前端入门教程，Web前端教程零基础前端视频教程哔哩哔哩_bilibiliwww.bilibili.com/video/BV1pE411q7FU
image
黑马程序员Web前端HTML5+CSS3+移动Web前端全套，零基础自学前端必备教程_哔哩哔哩_bilibiliwww.bilibili.com/video/BV1cf4y1j7hL
image
黑马程序员JavaScript全套教程，Web前端必学的JS教程，零基础入门JavaScript_哔哩哔哩_bilibiliwww.bilibili.com/video/BV1ux411d75J
image
黑马程序员web前端基础教程4天从零玩转jQuery哔哩哔哩_bilibiliwww.bilibili.com/video/BV1pt411H7D6
image
下面我们一起来看看网页开发工具VSCode小白级安装步骤吧！
VSCode安装步骤及基本使用方法介绍，需要掌握安装和卸载VSCode的插件，知道怎么设置VSCode的颜色主题和字体大小。
1、VSCode的基本介绍
全拼是VisualStudioCode(简称VSCode)是由微软研发的一款免费、开源的跨平台代码编辑器，目前是前端(网页)开发使用最多的一款软件开发工具。
2、VSCode的安装
(1)选择对应的安装包进行下载:
选择对应的安装包进行下载
(2)根据下载的安装包双击进行安装即可，当然为了更好的使用VSCode还可以安装对应的插件。
3、VSCode的插件安装
（1）汉化插件安装平台选择平台选择
汉化插件1
汉化插件2
（2）openinbrowser插件安装平台选择注意:如果在VSCode打开的html文档中右击没有出现openinbrowser类型的选项，需要把当前打开的文件关掉，重新打开这个文件就好了。
open in browser插件安装
4、VSCode的插件卸载
点击对应安装的插件，然后再点击卸载按钮即可。
5、VSCode的使用
（1）打开文件夹创建文件平台选择平台选择
打开文件夹创建文件1
打开文件夹创建文件2
（2）快速创建html文档的基本结构平台选择
快速创建html文档的基本结构
（3）右击在浏览器打开html文档平台选择
右击在浏览器打开html文档
6、设置字体大小
设置字体大小
设置字体大小2
7、设置颜色主题
设置主题
设置主题2
8、设置默认浏览器[可选]
可以根据自己的需要设置默认使用的浏览器
设置默认使用的浏览器
小结:VSCode是由微软研发的一款免费、开源的跨平台代码编辑器；通过资源管理器打开文件夹创建HTML文件，编写HTML代码；可以根据需要安装对应的插件；可以设置字体大小和颜色主题。
网友评论