首先要理解什么是HTML ：

 

　　正如上图介绍的，HTML是一个网页中的标准标记语言。全称是Hyper Text Makeup language.简单来说就是网页的设计要遵循这个规则。就像sql语言是所有数据查询语言的基础一样（SQL became astandardof theAmerican National Standards Institute（ANSI） in 1986, and of theInternational Organization for Standardization（ISO） in 1987 --from wikipedia）

 

　　而HTML5是最新的标准。而一个网站的界面的显示也通常由HTML结合CSS（Cascading Style Sheets）和现在非常流行的JavaScript一起组成。

 

　　最基础的结构如下

 

　　这个执行结果如下

 

　　这里要介绍一下上述的编码代表的含义

 

　　标签基本格式：

 

　　：用于代码开头指定html版本等信息

 

　　：告知浏览器这是一个 HTML 文档，是 HTML 文档中最外层的元素

 

　　：所有头部元素的容器，必须包含文档的标题（title），可以包含脚本、样式、meta 信息以及其他

 

　　：定义文档的标题，定义浏览器工具栏中的标题，显示在搜索引擎结果中的页面标题

 

　　：定义文档的主体，包含文档的所有内容（比如文本、超链接、图像、表格和列表等）

 

　　：定义 HTML 标题，从到标题的重要程度逐渐降低，字体大小也逐渐减小

 

　　：定义段落，浏览器会自动在其前后创建一些空白，很类似与我们写作时的段落：一个简单的换行符，是一个空标签，意味着它没有结束标签。

 

　　：定义 HTML 文档中的一个分隔区块或者一个区域部分。经常与 CSS 一起使用，用来布局网页。

 

　　这里介绍一下什么是CSS

 

　　CSS: Cascading Style Sheets 可以翻译为层叠样式表，这个主要是为结构化文档（包含HTML文档或XML应用）添加样式（字体、间距、和颜色等）的计算机语言，HTML或者XML一起协调工作，HTML确定网页中由哪些内容，而CSS主要用来确定以何种外观（大小，粗细，颜色，对齐和位置）

 

　　比如下面这个例子

 

　　在刚开始的时候，我说过h1到h6默认的是字体逐渐变小，但是这里可以通过css的设置把字体等等改掉，效果如下

 

　　不过在爬虫的过程中，我们重点关注的不是格式，而是链接中包含的超链接，或图片或表格等等。下面我们来看一下链接中常用的标签

 

　　标签实现基本的超链接

 

　　其中为标签，表示链接指向的地址，表示超链接的文本。其显示效果如下：

 

　　指向同一服务器同一目录下的form.html

 

　　指向同一服务器父目录下的parent.html

 

　　指向同一服务器子目录stuff下的cat.html

 

　　指向外部网站

 

　　超链接除了指向一个文件，还可以具体指明位置，这样浏览器就会直接跳转显示文件的相应位置。指向同一个文件的其他位置

 

　　效果如下

 

　　这里点击蓝色的部分可以直接跳转到Introduction部分

 

　　指向其他文件的某个位置

 

　　执行结果

 

　　点击蓝色超链接可以跳转至其他地方。

 

　　插入一张图片

 

　　其中为图片标签；表示服务器中的 php.png 这个图片；表示图片的代替文本，如果图片无法显示，则显示这个文本

 

　　为图片增加超链接：

 

　　结果如下

 

　　由于此处并没有实际的图片，所以显示的是我们常见的图裂了的模式。

 

　　我们来看一下标签的一些基本属性

 

　　：图片路径

 

　　：图片无法显示时的代替文本

 

　　：高度

 

　　：宽度

 

　　：边框宽度

 

　　无序列表一般用的形式来实现，一个简单的例子：

 

　　上面无序列表的代码在网页中显示如下：

 

　　其实在知乎上面就直接由无序列表，同时摁下ctrl +shift +8

 

　　ul 表示：unordered list 。li表示list

 

　　有序列表一般用的形式来表现，一个简单的例子：

 

　　上面的有序列表代码在网页中显示如下：

 

　　同样在知乎上面也有，这里不做展示了，所谓有序列表就是ordered list。也就是多了前面的数字

 

　　当然这个数字的起始值我们可以改变

 

　　这个就像python中设置起始位置

 

　　HTML表格由多种标签组合而成，其中最重要的三种标签是：

 

　　表格的开始和结束

 

　　创建表格的一行

 

　　创建表格中普通单元格

 

　　创建表格中标题栏单元格

 

　　一个简单的表格示例

 

　　实现的代码如下：

 

　　其中border是边界宽度

 

　　用于收集用户输入的信息，一个简单的例子如下：

 

　　这个表单在网页中显示为：

 

　　上面的基本就是常见的HTML的组成。就不继续深入下去了。用到的时候在学习吧。