<!--DOCTYPE:告诉浏览器我们要是用什么规范-->
<!DOCTYPE html>
<html lang="en">
<!--head标签代表网页头部-->
<head>
    <!--meta 描述性标签，用来描述网站的一些信息-->
    <meta charset="UTF-8">
    <title>我的第一个网页</title>
</head>
<!--body代表网页主体-->
<body>
hello,world！
</body>
</html>

Second, the basic tags of the web page

1. Title tag

<!--标题标签-->
<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>

2. Paragraph tags

<!--段落标签-->
<p>这是一个段落</p>

3. Newline label

This is a self-closing label

<!--换行标签-->
<br/>
<br>

4. Horizontal line label

The label directly outputs a horizontal line on the web page

<!--水平线便签-->
<hr/>
<hr>

5. Font style label

<!--粗体，斜体-->
<strong>粗体</strong>
<em>斜体</em>

6. Comments and special symbols

Special symbols, just use Baidu

<!--特殊符号-->
空格 &nbsp;
大于号 &gt;
小于号 &lt;

3. Images, hyperlinks, web page layout

1. Image

<!--图像标签-->
<img src="图片地址",alt="图片不显示时显示的内容",title="图片悬停显示文字",width="宽度",height="高度">

2. Hyperlink

General hyperlink

<!--
a标签超链接:
href为超链接的地址
target为超链接打开的地方（当前页面，新页面等）
-->
<a href="https://www.baidu.com" target="_blank">百度一下，你就知道</a>
<a src="https://www.baidu.com"><img src="图片地址"></a>

Anchor link

Anchor links realize jumps to different positions, including the same page and different pages

<!--
锚链接:
1.设置锚点
2.执行跳转
-->
<!--锚点-->
<a name="anchor1">锚点一</a>
<!--同文件-->
<a href="#anchor1">跳转到锚点一</a>
<!--跨文件-->
<a href="路径/文件#anchor1"></a>

Functional link

<!--
邮件链接
-->
<a href="mailto:[email protected]">点击联系我们</a>

Four, lists, tables, media elements

1. List

The list can structure and organize the information and display it in the style of a list

Ordered list

<!--有序列表 ordered list-->
<ol>
    <li>迪迦奥特曼</li>
    <li>泰罗奥特曼</li>
    <li>雷欧奥特曼</li>
    <li>捷德奥特曼</li>
    <li>欧布奥特曼</li>
</ol>

Unordered list

<!--无序列表 unordered list-->
<ul>
    <li>迪迦奥特曼</li>
    <li>泰罗奥特曼</li>
    <li>雷欧奥特曼</li>
    <li>捷德奥特曼</li>
    <li>欧布奥特曼</li>
</ul>

Custom list

<!--
自定义列表 DIY list
dt:列表名字
dd:列表内容
-->
<dl>
    <dt>奥特曼</dt>
    <dd>迪迦奥特曼</dd>
    <dd>泰罗奥特曼</dd>
    <dd>雷欧奥特曼</dd>
    <dd>捷德奥特曼</dd>
    <dd>欧布奥特曼</dd>
</dl>

2. Form

colspan: cross column

rowspan: inter-row

<!--表格 table
行 tr
列 td
-->

<table border="1px">
    <tr>
        <td colspan="4">   </td>
    </tr>
    <tr>
        <td rowspan="2">   </td>
        <td>   </td>
        <td>   </td>
        <td>   </td>
    </tr>
    <tr>
        <td>   </td>
        <td>   </td>
        <td>   </td>
    </tr>
</table>

3. Media elements

<!--视频元素
controls:控制控件
autoplay:自动播放
-->
<video src="视频地址" controls autoplay></video>

<!--音频元素-->
<audio src="音频地址" controls autoplay></audio>

The content of the article is organized according to the self-study of the html part of " Meeting Crazy God" . I would like to thank the blogger here .

html knowledge summary (1) basic tags, lists, tables, hyperlinks

html knowledge summary (1)

1. What is HTML