一．简介
随着计算机网络的不断发展，网上冲浪成为了不少人的兴趣和爱好，在网络上我们可以看视频综艺，听音乐，阅读电子书。在我们浏览网页的过程中，浏览器是一个使用的工具，帮助我们屏蔽了很多的细节，包括如何请求一个网页，又是如何解析服务器返回的响应文档。
下图为我们常用的几款浏览器，百度我们经常用到的搜索引擎。在众多的浏览器之中，大多都支持开发者模式，我们可以很简单的查看和修改网页的内容，观察请求的数据信息和服务器返回的信息，但是我们是没有方法了解浏览器引擎的渲染方法的。
我们需要注意的是，本文更加关注的是如何获取HTML文档，而不是HTML文档的格式规范，但是为了使得对HTTP协议的了解更加容易，我们需要对有关的背景知识进行普及。
二．有关背景
在这之中，我们需要了解几个比较基本的背景知识。在我们通常访问的网页中，大部分都是基于HTML的网页文档，即超文本标记语言（HyperText Markup Language）。万维网上的一个超媒体文档称之为一个页面（外语：page）。作为一个组织或者个人在万维网上放置开始点的页面称为主页（外语：Homepage）或首页，主页中通常包括有指向其他相关页面或其他节点的指针（超级链接），所谓超级链接，就是一种统一资源定位器（Uniform Resource Locator，外语缩写：URL）指针，通过激活（点击）它，可使浏览器方便地获取新的网页。这也是HTML获得广泛应用的最重要的原因之一。在逻辑上将视为一个整体的一系列页面的有机集合称为网（Website或Site）。超级文本标记语言（英文缩写：HTML）是为“网页创建和其它可在网页浏览器中看到的信息”设计的一种标记语言。
而现在流行的HTML5是超文本标记语言的第五次重大修改。在该语言规范中，使用成对的标签来表示互联网资源等，包括容器、列表和图像等，使用CSS层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式，包括字体大小，元素的宽高等。使用Javescript脚本语言来控制元素的动态变化，如下图Bilibili网站首页的滚动图像。
图3 bilibili官网首页的滚动图像
超文本的基本特征就是可以超链接文档；你可以指向其他位置，该位置可以在当前的文档中、局域网中的其他文档，也可以在因特网上的任何位置的文档中。这些文 档组成了一个杂乱的信息网。目标文档通常与其来源有某些关联，并且丰富了来源；来源中的链接元素则将这种关系传递给浏览者。
标记语言的真正威力在于其收集能力，它可以将收集来的文档组合成一个完整的信息库，并且可以将文档库与世界上的其他文档集合链接起来。这样的话，读者不仅可以完全控制文档在屏幕上的显示，还可以通过超链接来控制浏览信息的顺序。这就是 HTML 和 XHTML 中的 “HT” - 超文本（hypertext），就是它将整个 Web 网络连接起来。
HTTP的发展是万维网协会（World Wide Web Consortium）和Internet工作小组IETF（Internet Engineering Task Force）合作的结果，（他们）最终发布了一系列的RFC，RFC 1945定义了HTTP/1.0版本。其中最著名的就是RFC 2616。RFC 2616定义了今天普遍使用的一个版本——HTTP 1.1。
HTTP协议是用于从WWW服务器传输超文本到本地浏览器的传送协议。它可以使浏览器更加高效，使网络传输减少。它不仅保证计算机正确快速地传输超文本文档，还确定传输文档中的哪一部分，以及哪部分内容首先显示(如文本先于图形)等。有关的标签和样式见附录1和附录2。对了，我可能还忘记了,我们csdn的编辑器就是基于html的，所以我在附录1的标签时会被当做系统的标签而显示不出来
附录1 常用html标签
<html>----开始标签
<head> 网页上的控制信息 <title>页面标题</title></head>
<body>页面显示的内容</body>
</html>----结束标签
1.1.1格式控制标签
<font color="" face="" size=""></font>控制字体： face字体，size字体大小。
<b></b>字体加粗
<strong></strong>字体加粗（强调，语气加强用）
<i></i>倾斜
<em></em>字体倾斜（强调，语气加强用）
<u></u>下划线
<center></center>居中
<br>或</br>下一行，代表回车 shift+enter
1.1.2内容容器标签
<h1></h1>......<h6></h6>标题（自动换行）
<p></p>段落标签
<div></div>层标签（默认占一行）
<span></span>层标签（默认用多大空间占多大空间）
<ol type="1">有序列表，序号为1,2,3......，引号中可以更改序号形式
<li>内容</li>
<li>内容</li>
</ol>----“ol”改为“ul”则为无序列表
"../"表示上级目录（当前文档所在文件夹上一层）
"./"表示当前目录
相对路径：从当前页面开始查找。相当于html文档在哪一层同级别文件下同一路经。
绝对路径：从网站的根开始查找。“/”代表网站的根。
超链接标签<a href=“地址”target=“_blank”>文字></a>
图片标签<img src="图片地址" alt="文字" width="" height=""/>
附录2 常用CSS样式
color : #999999; /*文字颜色*/
font-family : 宋体,sans-serif; /*文字字体*/
font-size : 9pt; /*文字大小*/
font-style:itelic; /*文字斜体*/
font-variant:small-caps; /*小字体*/
letter-spacing : 1pt; /*字间距离*/
padding-top:10px; /*上边框留空白*/
padding-right:10px; /*右边框留空白*/
padding-bottom:10px; /*下边框留空白*/
padding-left:10px; /*左边框留空白
background:transparent; /*透视背景*/
background-image : url(/image/bg.gif); /*背景图片*/
background-attachment : fixed; /*浮水印固定背景*/
background-repeat : repeat; /*重复排列-网页默认*/
background-repeat : no-repeat; /*不重复排列*/
background-repeat : repeat-x; /*在x轴重复排列*/
height:100px; /*设置元素高度*/
width:100px; /*设置元素宽度*/