HTML基础学习工具，VSCode & 谷歌浏览器

HTML基础的学习工具

对于HTML的学习，我所使用的学习工具是VSCode和谷歌浏览器。接下来为大家介绍这两款软件的简要安装步骤。
谷歌浏览器的安装
对于谷歌浏览器，只需要到网站上检索谷歌浏览器，自行下载安装即可。
下载好了之后，基本上都是一个exe可执行程序，双击运行即可。
下载完成的图标如下

它的大小大概是50MB左右。下载完成之后，双击运行即可。
VSCode的安装
随后就是VSCode的安装，这款软件的全程叫做Visual Studio Code。
我所使用的版本是

此软件的安装过程也比较的简单，我就简述一下正常情况下的安装过程
双击安装程序之后，会弹出安装窗口

选择下一步。这个页面主要是对你的计算机环境的检测，如果你有正在运行的vscode程序，则它就会在这一步报错，让你关闭其他VSCode实例后再重新运行。如图所示

接着，在你单击下一步之后，就是如下视图。基本上每个软件或者游戏都会有的一个用户协议，就算你刚买的电脑开机配置的时候都会有，选择我接收协议，就可以继续进行安装步骤。

这个是VSCode的安装目录，可以自行决定此软件安装的位置单击后面的浏览，即可自行选择该软件的安装目录。个人建议将软件安装到除系统盘的位置，比如Windows的C盘之外的盘。

之后就是将该软件放入到开始菜单栏中，此项直接默认即可。

接下来就是选择其他的任务，比如创建桌面快捷方式之类的一些配置，此项也默认即可。一般情况下，安装软件默认安装是没有问题的。

这一步就是安装了，单击安装之后，就可以等待安装程序运行。

都安装完之后，就可以打开使用了。

其中需要额外说明的是，谷歌浏览器的默认搜索引擎在中国是被禁止使用的，所以，直接在谷歌浏览器上输入网站或者搜索关键字是没有任何作用的，会被提示无法访问网页。

我一开始使用谷歌浏览器的时候，还以为什么东西没设置好，导致谷歌浏览器无法使用，尴尬。

其次就是对于HTML的学习，我们需要打开VSCode，之后在 查看->扩展 中打开扩展视图，对VSCode安装一个小插件

在左上角的扩展中，搜索open in browser，搜索出来之后，单击安装。我这里因为已经安装好了，所以第一个open in browser的右下方没有绿色的安装按钮，而是一个齿轮状的东西，表示可以对其进行设置或者配置。

安装完成之后，当我们创建新的HTML文件，并在其中写了布局保存之后，就可以在VSCode中右击，在浏览器中打开。可以很方便的对我们写得HTML页面样式进行查看和更改。

比如：

在VSCode中选择新建文件，保存为HTML格式的文件，写下如图简单的代码，Ctrl+s之后，就可以右击，选择Open In Default Browser 使用默认浏览器打开，或者选择Open In Other Browser使用其他浏览器打开。我选择的是使用其他浏览器打开，然后选择第一个Google Chrome。当然如果你将谷歌浏览器作为你的默认浏览器也可以使用默认浏览器打开。

使用谷歌浏览器打开之后就会是这样的情况

<!-- 这里是分割线，上面是图片 -->

其中，在谷歌浏览器中按F12，或者右击选择检查都可以呼出一个这个东西，或者使用谷歌浏览器的默认快捷键Ctrl+Alt+I。这里面可以看到我们原来在VSCode中写的代码，以及右侧它的一些css布局参数，这些东西，之后会再做说明。

在下面这种视图下，我们就可以对我们写的HTML页面进行微调，或者查看其他优秀网页的HTML代码，已进行学习和进步。只要打开某一个网页，之后进入此视图即可。

到目前为止，我们的基础软件都差不多装备完成，接下来我们就可以进入基础的HTML学习了。