1、<!doctype> 标记
<!doctype>标记位于文档的最前端，用于向浏览器说明当前文档使用的是那种HTML标准规范。只有在开头处使用 <!doctype> 声明，浏览器才能将该网页作为有效的HTML文档，并且按照指定的文档类型进行解析。
2、<html> 标记
<html> 标记也称为根标记，用于告知浏览器其自身是一个HTML文档。<html> 标记是成对出现的，开头为 <html> （表示html文档的开始） ，结尾为 </html> （表示html文档的结束）。
3、<head> 标记
<head> 标记用于定义HTML文档的头部信息，也成为了头部标记，紧跟在 <html> 标记之后，只要用来封装其他位于文档头部的标记（就是头部标记代码的一个范围），例如在其中可以书写 <title> 、 <meta> 、 <link> 、 <style> 等。用来描述文档的标题，作者，以及与其他文档的关系等。
（<head> ······ </head> 所封装的部分为头部标记，在网页的正式页面当中是无法看到的！！！）
4、<body> 标记
<body> 标记用于定义HTML文档所要显示的内容，也称为主体标记。浏览器中显示的所有文本、图像、音频和视频等重要信息都 <body> 标记内。（<body> ······ </body> 说封装的部分为内容标记部分，此部分在正式的网页中时可以让用户看的到的所有部分！！！）
PS：一个HTML文档只能含有一对<body> ······ </body> 标记 ！！！
并且<body>······</body> 标记必须在<html>······</html> 标记内，
位于<head>······</head> 头部标记之后，
与<head>······</head> 是并列关系
下面是一个HTML的初始完整格式。
双标记：双标记是由开始和结束2个表级符组成的标记。其基本语法格式为：
此语法中 <标记名> 表示该标记的作用开始，一般称为“开始标记”；而 </标记名> 表示改标记的作用结束，一般称为“结束标记”。和开始标记相比，结束标记只是增加了“/”
单标记：单标记也称空标记，是指用一个标记符号即可完整的描述某个功能的标记。起基本语法格式为：
如果需要在HTML 5 文档中添加一些便于阅读和理解但又不需要显示在页面中的注释文字，就需要使用注释标记。其基本语法格式为：
使用HTML 5 制作网页时，如果想要 HTML 标记提供更多的信息（比如修改文字的字体，颜色，斜体等属性），需要使用HTML 标记的属性加以设置。起基本的语法格式为：
在上面的语法中，标记可以拥有多个不同的属性，必须写在开始标记中，位于标记名后面。属性之间不分先后顺序，标记名与属性、属性与属性之间均以空格分开。
需要注意的是，在标记的嵌套过程中，必须先结束最靠近内容的标记，再按照由内到外的顺序依次关闭标记。
<title>标记用于定义HTML页面的标题，即给网页取一个名字，必须位于<head>标记之内。一个HTML文档只能包含一对<title></title>标记。其基本语法格式为：
<meta/>标记用于定义页面的元信息，可重复使用。可以为搜索引擎提供网页的关键字、作者姓名、内容描述、以及定义网页的刷新时间等。
下面介绍<meta/>常用的几组设置。
（1）
name属性提供搜索内容，content属性提供对应的搜索内容值。
当name后面的名称为keyword的时候，即定义搜索内容名称为网页关键字；content属性后的值用于定义关键字的具体内容。
PS：此处的为bilibili官方网站的源代码。可以看到后面的值有很多，当我们在搜索引擎中搜索这些关键字时，搜索引擎会从此处查找，所以我们在搜索完这些关键字时才会弹出bilibili。
（2）
当name属性后的名称为author的时候，即定义搜索内容名称为网页作者；content属性后的值用于定义具体的作者信息。
（3）
·（1）设置字符集
（uft-8是目前最常用的字符集编码方式，其他常用的字符集编码方式还有gdk和gb2312）
·（2）设置页面自动刷新与跳转
<link/>标记可以用外部文件，一个HTML 5 页面允许使用多个<link/> 标记引用多个外部文件。其基本语法格式为：
<link/>标记的常用属性
text/css
text/javascript
<style>标记可以为HTML 5 文档定义样式信息。其基本语法格式为：
在HTML 5 中使用<style>标记时，常常定义其属性为type，相应的属性值为 text/css，表示使用内嵌式的CSS样式。
即标题的等级设置。HTML 5提供了6个等级的标题（分别是：<h1>、<h2>、<h3>、<h4>、<h5>、<h6>，并且从1-6重要性递减）。
基本语法格式为：
PS：（1）一个页面中只能使用一个<h1>标记，尝尝被用在网站的Logo部分。
（2）由于h元素拥有确切的语义，请慎重选择恰当的标记来构建文档结构。禁止仅仅使用<h>标记设置文字加粗或更改文字的大小。
（3）align属性可以设置对其方式，比较常见的对其方式有：left（左对齐（默认）），center（居中对齐），right（右对齐）。
即为分开段落的标记。默认情况下，段落中的文字会根距浏览器窗口的大小自动换行。其基本语法格式为：
PS：从上图可以看到，此标记只可以单纯的分段，不会自动换行，即使在代码中有分段或空格符号，在最终的显示页面也不会显示。
即在网页中创建水平线的标记。可以使得网页文档内容更加清楚，层次分明。其基本语法格式为：
<hr/>的属性如表所示：
具体的效果图如下，代码也如下图
即可以在网页中将文本强制换行显示（注意：在HTML代码中敲击回车，文本是不会进行换行的，只有使用此标记才可以强制换行。）
在网页中，可以为文字设置粗体、斜体或下划线效果的标记为文本格式标记。常用的文本标记如下表所示：
下面展示一下效果：
PS：以上文本格式化标记均可使用<span>标记配合CSS样式替代。
HTML 5 中对于一些特殊字符有着特殊的标记，如下表：
在网页中想要使用图像，就需要使用图像标记。起基本语法格式为：
该语法中src属性用于指定图像文件的路径和文件名，他是<img/>标记的必须属性。在HTML中的<img/>标记还有很多其他的属性，如下表：
在实际的应用中，由于某些原因导致图像可能无法正常显示，替换文本就是在这种情况下替换图片信息。
随着互联网的发展，现在显示不了图像的情况已经很少见了，alt属性又有了新的作用。搜索引擎在收录页面时，会通过alt属性的内容来分析网页的内容。
因此，如果在制作网页时，为页面中的图像都设置清晰明确的替换文本，就可以帮助搜索引擎更好地理解网页内容，从而更有利于搜索引擎的优化。
图像标记<img/>有一个和alt属性十分类似的属性title，title属性用于设置鼠标指针悬停时图像的提示文字。代码具体如下：
通常情况下，如果不给<lmg/>标记设置宽和高，图像就会按照它原始尺寸显示，，我们此时可以使用这两个属性进行设置。如果同时设置这两个属性，且其比例和原图大小的比例不一致，显示的图像就会变形或失真。
默认情况下图像是没有边框的，通过border属性可以为图像添加边框。设置边框的宽度。但边框颜色的调整仅仅通过HTML属性是不可能完成的。
我们用代码编写出来一个网页，效果和源代码如下：
PS：我是用的原图比例为1080x1080，图一注意外圈有边框
我们可以看到在只更改一个高或者宽的情况下，图片会按照比例进行缩减，当我们同时更改两个属性，并且与原图比例不相同时，图片就会变形或失真。
在HTML 5 中通过vspace和hspace属性可以分别调整图像的垂直边距和水平边距。
在制作网页时经常需要实现其他的图像和文字环绕效果，如图像居左文字居右等，这就需要使用图像的对齐属性align。
注意：（1）HTML 不赞成图像标记<img/>使用border、vspace、hspace及align属性，可用CSS样式替代。
（2）网页制作中，装饰线的图像都不要直接用<img/>标记插入，而是应通过CSS设置北京图像来实现。
绝对路径就是网页上的文件或目录在硬盘上的真正路径。
网页中不推荐使用绝对路径，因为网页制作完成之后我们需要将所需要的文件上传到服务器，这时图像文件可能在服务器的c盘，也可能在任何盘中，也就是说，在更改之后服务器路径可能不再是原来的路径。
相对路径就是网页中的文件相对于当前HTML文件的路径。相对路径不带有盘符，通常是以HTML网页为起点，通过层级关系描述目标图像的位置。
总结起来，相对路径的设置分为一下三种：
即可以建立超链接，其基本语法格式为：
（2）target：用于指定链接页面的打开方式，其取值有_self和_blank 2种，其中_self为默认值，以意为在原窗口中打开，_blank为在新窗口中打开。
（2）不仅可以在文本中创建超链接，还可以在各种网页元素（如图像。音频、视频等）中添加超链接。
（3）图像超链接在低版本的IE浏览器中会自动添加边框效果，去掉链接图像的边框只需将边框定义为0即可。