前面我们已经在控制台中进行了第一行代码的体验，但那只是一次性的，关闭浏览器再打开就没有了，我希望保留我的成果，以便于拿出来跟别人吹牛的炫耀一番，看啊，我已经学会写代码做开发了！
1. 留住你的成果
在电脑上保存一个什么东西，最常见的方式就是新建一个文件。首先我们先新建一个文本文档，在你喜欢的任意位置。 我将它命名为mycode.txt
双击打开记事本，复制一下代码并粘贴进去：
<!DOCTYPE html>
<html>
<head>
<title>我的代码</title>
</head>
<body>
<div>hello world</div>
</body>
<script>
console.log("hello world")
</script>
</html>
保存文件，然后修改文件的后缀名为.html
当你看到这个提示的时候，单击“是”
现在我们已经拥有了一个HTML文件，双击打开它：
恭喜，现在你已经拥有一个最简单的网页了，在这个网页中我们将标签页的标题显示为“我的代码”，并且在控制台和页面上分别输出了hello world
2. 它怎么就好使了呢？
现在我简单介绍一下这个简单页面的构成，从上至下的解读它：
第一行，这是一个几乎固定的写法，其作用是告知浏览器将要加载的文档应该采取何种方式加载，浏览器在读到这一行的时候就会知道这是一个文档，需要以HTML的方式加载。
从第二行开始，是成对出现的标签。如<html></html>、<head></head>，它们被称为标签，或者标记，是HTML最基本的组成单位。
HTML，即超文本标记语言（Hyper Text Markup Language），采用标签化的文档来描述网页。每个标签都有其固定的含义和用法，这里不在深究。在最新的语法规范中，要求标签必须成对出现，有头有尾，标签可以嵌套使用，打造层次丰富的页面内容。
<html>标签表示这是HTML的内容部分。
<head>表示HTML的头部，我们目前的头部仅有一个<title>指定标题名称，实际上一个网页的head部分拥有很多内容，可以指定网页的缩放、提供给搜索引擎抓取的关键字、文档的编码、引入的外部文件和资源等，下面展示了一个百度页面的head部分：
<body>中的内容将会被加载到网页的内容区中展示，我们在网页上看到的内容，大部分都需要写在body中。
为什么是大部分的呢？因为还有一部分的内容是通过脚本加载的，上一篇中使用过的document.write()就是通过脚本向网页中写入内容的一种方法。
<script>表示其中的内容为网页脚本，通常是JavaScript语言脚本。我们在上一篇中用过的document.write()和console.log()都是JavaScript。JavaScript也将成为我们接触编程的起点。
3. 换个喜庆的颜色吧！
除了上面提到的HTML、JavaScript两种语言，还有写在<style>标签中的CSS，即层叠样式表，负责为网页增光添彩。HTML、JavaScript、CSS被称为前端开发三剑客，是前端开发者必不可少的技能。
这三种技术缺一不可，就像一个人，HTML提供了网页的躯体，CSS给它穿上了衣服画上了精致的妆容，JavaScript提供了交互性，让页面动起来，这样才能制造出一个交互良好、页面美观的网页。
如图所示，修改代码，我们将得到一行红色的hello world：
为了方便，我使用了VS Code来编辑这个文档。
现在我们已经初步的感受到了开发的魅力，你可以尝试自己修改它，按照你的想法，不用担心它会坏掉。
