编写html页面前的准备工作

代码编写工具
在开始之前，我们还需要做一些准备工作。首先我们需要安装一款代码编写工具，在这里我推荐使用Hbuilder-x，因为从软件的用户体验上来讲，与市面上的VScode、Sublime Text、WebStorm、Atom这些软件相比，它确实比较简单、好用，这个软件的体积也非常小，大概十几M,也不需要安装，只要下载后解压即可使用，尤其对于初学者来讲，几乎不需要任何成本就可以快速掌握。

Hbuilder-x官网下载地址：http://www.dcloud.io/hbuilderx.html

Chrome浏览器：开发人员必备
在使用Hbuilder软件编写代码后，我们可以运行于Chrome浏览器观看页面效果。 Google Chrome的特点是简洁、快速。此外，Google Chrome基于更强大的JavaScript V8引擎，这是当前Web浏览器所无法实现的。

Hbuilder-x使用方法
下载上述两款软件之后，我们来实际操作如何新建一个html页面。打开hbuilder后，我们可以点击新建-项目创建好以后我们就得到了一个空的项目，有三个空的文件夹css、img、js和一个模板页面index.html,我们就可以在这个模板页面上来编写我们的代码了，如下图所示

编写好之后，如何来测试呢，就可以使用到我们刚才聊到的chrome了，在运行按钮下方点击chrome就可以了

chrome运行效果（第一次打开chrome速度会比较慢）
我们现在使用的HTML版本是HTML5的版本，简称H5，发行于2014年，与1997年发行的HTML4相比，相差了十几年，所以HTML5是一个重大的版本，它增加了很多内容，以后我会一一介绍。对于初学者来讲，有一件事情要格外地注意，就是写代码的时候一定要有缩进，就像我们小学写作文开头空两格。那什么时候该使用缩进呢，规则也非常的简单，就是正在使用的标签嵌套在了另一个标签的内部。

缩进使用tab键而非空格
认识网页的基本结构
最后我们来认识一下网页的基本结构，首先一个标准的网页，开头需要写上这句声明，就是告诉浏览器，请使用HTML5的标准来解析这个网页。

然后就是网页的正文内容了，大致分为两块，第一块是网页的头部标签，这里的信息都是对网页的整体说明，第二块是标签，这里存放的就是网页需要显示的内容了，在网页看到的效果，全部都需要写在这里。

网页结构
了解了这么多，大家可以实际操作消化一下