提到Web前端，大家的第一反应是HTML，那今天就来介绍什么是HTML？以及如何用HTML承载常见的资源类型，并用简单的小例子进行展示。
1.HTML和Web前端的关系Web前端，是指实现和维护用户界面的过程，有人也说这个名词代表的是一种职业，由最初的网页设计师发展而来。
而Web前端技术，则是实现多种形式、和丰富功能的界面开发所需要涉及到的技术，包括HTML、CSS、JavaScript、JQuery、PHP等各种衍生技术、框架等（当然具体还得看实际业务需要）。
从这个角度来看，HTML是Web前端技术的一部分，但因为HTML作为Web开发的核心，且通常是和CSS、JavaScript等一起配合使用，所以也常有人会说“HTML就是前端”。
作为标记语言，HTML能够实现简单的网页设计，但如果是做Web前端开发，并想实现丰富的功能和效果的，则仅学HTML是远远不够的，还得打好其它技术的基础。
2.什么是HTML？HTML的全称为超文本标记语言（HyperTextMarkupLanguage），是一种用于创建网页的标记语言，也可以认为是一种标准和规范。
HTML文档（后缀为html的文件）本身是一种文本文件，可以用记事本打开查看源码，也可以用浏览器经过解释渲染后打开，因此HTML文档也被叫做Web页面。
HTML5是HTML标准的最新的修订版本（第5次最大修改后版本），它仍处于完善之中，它继承了前面版本的所有语法（但并不代表HTML5和HTML4兼容），目前大部分浏览器都支持HTML5。
那HTML如何将各种类型的资源，都组织在一起的呢？其实就是通过超链接的方法，把各种类型，存放在不同地点的资源，用链接的形式整合在一起。前面说了，HTML本身是一种文本，如何让浏览器解释的时候识别是要引入哪一类的资源文件呢？那就是通过标签来承载这些内容。
3.HTML的标记（标签）是什么？我们先来看一个例子，可以打开记事本，输入以下内容后，点击保存，然后把记事本文件的.txt后缀改为.html，用浏览器打开。
!DOCTYPEhtmlhtml!--页面属性--headmetacharset="utf-8"title测试网页/title/head!--页面内容--bodyh1一级标题/h1p我是一个段落。/p/body/html
打开后可以看到如下的界面。如上面的代码中，由括一个关键词（x）的部分，就是HTML标签（HTML标记），它通常是成对出现的（前面一个x，后面一个/x），一个是开始标签（开放标签），一个是结束标签（闭合标签），组成一个代码块，有些关键字并不需要结束标签（如段落标签p），但为了格式的规范，还是要一前一后加个标签。
HTML代码并不严格要求缩进哈，它是根据开放标签和相对应的结束标签来识别内容的，不依靠缩进判断层级关系，我上面的含缩进的写法只是为了方便阅读而已。
像上面的代码，是HTML代码的一般结构，其中，第一句的!DOCTYPEhtml是什么HTML的版本为HTML5（HTML4.01的开头代码为!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""