姬小光前端小讲堂【第004期】
前面几期我都在尝试以最平缓的曲线让大家快速入门，后续根据同学们的反馈，内容的深度会逐步提升。那么这一期我们来说说文档类型与HTML页面的基本结构。
文档类型与 HTML 页面的基本结构
文档类型（doctype）说白了就是HTML有几个版本，你需要告诉浏览器用哪个版本的规范来解释，才能处理得更好。
在 HTML5 （对，就是传说的H5）以前的文档类型非常冗长，大家可以不用在意了。感兴趣的同学可以百度一下我之前写的文章《深入理解浏览器兼容性模式》深入理解一下。
对于现在的HTML页面，你只需要在代码的最前面写上如下内容即可：
<!DOCTYPE html>
下面让我们来看一下HTML页面的基本结构：
在第一期（回复 001）的补充技能中已经教过大家，在网页上点击右键“查看源代码”，即可看到页面的前端代码，不知道大家有没有尝试一下，还没有试过的同学可以亲测一下了，你会发现大体上跟上面的结构都是类似的。
我们再来看这段代码，其中 <!DOCTYPE html> 部分我们已经说过了，请看下面的 <html> ，由于我们使用的是 HTML 语言，所以 HTML 类型的文档需要以一对 HTML 标签包裹。
再往下的标记是 head 和 body 相当于页面的“头”和“主体”部分，下面这张图能帮助你更好滴理解：
页面的 head 部分主要负责一些需要预先加载的元信息，样式，脚本，以及页面标题等。而 body 部分则是我们页面的主题内容，比如段落文字，图片，链接等。
那么，既然我们已经学会了标准的 HTML 文档写法，就让我们把上一期的代码继续优化一下，变成漂亮而标准的 HTML 代码吧：
当然，保存之后页面的显示不会有任何变化，只是在浏览器的 tab 处显示了标题：
细心的同学可能发现，这次代码的截图变漂亮了，而且关键的部分也用不同的颜色标了出来，太方便了有木有？
其实这是一款非常强大的编辑器，叫做 sublime text 2，大家可以百度一下下载一个玩玩。想真正写些代码，没有一款得心应手的编辑器肯定是不行的，所以希望大家都去下载一个编辑器，当前流行的 sublime 更强大一点。
OK, 下课。