目录
1.1html的介绍
1.2html的基础1
1.2.1标题，头部与基本的格式怎么写
1.2.1.1标题与基本格式
1.2.1.2头部
1.2.2段落
1.2.3链接
1.2.3.1基本的网页链接
1.2.3.2图像链接
1.2.4注释
1.1html的介绍
HTML是一种标记语言，用于创建，设计网页及其内容。它通过标记和标签定义网页中的结构和元素，如标题、段落、链接、图像等。HTML 文件通常以 `.html` 扩展名保存，并通过浏览器进行渲染，展示给用户，即我们现在所看到的网页。在html中会出现很多类似于<h1>这样的东西，我们称它为标签，html中需要注意的是，标签往往是成双成对的出现。比如说<h1> </h1>
1.2html的基础1
1.2.1标题，头部与基本的格式怎么写
1.2.1.1标题与基本格式
标题的英文是head,所以它的标签是<h>,而<h1>--<h6>便是标题的等级，<h1>便是最大的那个标题，而<h6>就是最小的标题。但是在写代码的时候，与之前我更新的python文档中还是很不一样的。看一下一个例子
这里的话需要注意，html的运行方式与python很不一样，因为python属于后端，html属于前端，这个是啥意思呢，前端就是指你可以看到的网页。所以说vscode无法像浏览器一样解析这一段代码，给你一个网页，所以运行与python很不一样。运行的步骤第一步：保存你的代码，第二步：找到这个编程所对应的文件，第三步：用浏览器打开。
<html>
<body>
<h1>Charles Wesley</h1>
<h2>Charles Wesley</h2>
<h3>Charles Wesley</h3>
<h4>Charles Wesley</h4>
<h5>Charles Wesley</h5>
<h6>Charles Wesley</h6>
</body>
</html>这里首先需要写<html>，这个表示这段代码表示的是html的语言，注意不要忘记</html> （但是这个vscode中会自动显示）body很简单的意思，就是网页的主题，那么接下来就是标题<h1> ---<h6>，可以来看一下他们的区别
这个从上往下，便是一级标题到六级标题。
当然我们可以开心的是，我们已经制作了一个网页，但是不开心的是这个网页显然不能满足我们他所的欲望，因为这个实在是太简单了。
在这一块中可以添加<hr>标签，这个标签指的是可以在中间加上一条分割线（注意这个与一般的标签不一样，它没有</hr>的需求，所以你常常只看到<hr>在代码中。）
<html>
<body>
<h1>Charles Wesley</h1>
<hr>
<h2>Charles Wesley</h2>
<hr>
<h3>Charles Wesley</h3>
<hr>
<h4>Charles Wesley</h4>
<hr>
<h5>Charles Wesley</h5>
<hr>
<h6>Charles Wesley</h6>
</body>
</html>
可以看到h1的标题与h2的标题之间有一条线，这个就是<hr>的作用，同样再次强调一下<hr>没有</hr>。
1.2.1.2头部
何为头部
这个箭头所指的“CSDN博客-专业IT指数发表平台”这个叫做头部
头部的标签一般使用<title>来完成，当然别忘记了它的“兄弟”。
<html>
<body>
<title> Charles Wesley</title>
<h1>Charles Wesley</h1>
<p>在<br>CSDN<br>上更新博客</p>
<hr>
<h2>Charles Wesley</h2>
</body>
</html>
这里的头部已经改成了Charles Wesley。
1.2.2段落
段落的英文是paragraph，所以说在html的标签是<p>，注意不要忘记它的“兄弟”</p>
接下来就是用一个例子来看一下
<html>
<body>
<h1>Charles Wesley</h1>
<p>在CSDN上更新博客</p>
<hr>
<h2>Charles Wesley</h2>
</body>
</html>可以看一下我们的网页
你看在第一个标题下面就有我们的正文了，也就是<p>中所写的东西
这个代码还是非常简单的。
但是在我们写段落的时候有些时候想换一下行，这里有一个关于换行的标签，这个标签也非常的特殊，与之前学到的<hr>一样没有“兄弟”，它是<br> 我们用来换行。
<html>
<body>
<h1>Charles Wesley</h1>
<p>在<br>CSDN<br>上更新博客</p>
<hr>
<h2>Charles Wesley</h2>
</body>
</html>在段落这理增加了<br>标签
可以看一下我们新的页面
在这里发现在 CSDN 上更新博客这几个换行
1.2.3链接
1.2.3.1基本的网页链接
同样在一个网页中，你会常常看见超文本链接，假设你喜欢周深（我也很喜欢他），在百度百科搜索周深，在百度百科中会有很多关于他的链接，那么链接怎么在html代码进行书写呢这里就有一个标签是关于超文本链接的
<a>就是这个标签，但是这个标签有一定的格式，就是<a href="URL">想要呈现的文字</a>
<html>
<body>
<title> Charles Wesley</title>
<h1>周深</h1>
<p>一个非常优秀的歌手</p>
<a href="https://baike.baidu.com/item/%E5%91%A8%E6%B7%B1/15089196">这个是他的介绍</a>
<hr>
</body>
</html>
你可以看到我们所熟悉的超链接，点一下就可以到我所写的那个网页了（这个网页出自百度百科）
同样这个是周深老师的网页，然后如果有冒犯的话，非常抱歉，我会马上改成其他的示例。
这个就是跳转的网页。
1.2.3.2图像链接
图像其实有两种方式进行编写，第一种方式运用这个图像链接
图像英文是image, 标签是<img>
这个的格式是有一点复杂的
<html>
<body>
<title> Charles Wesley</title>
<h1>周深</h1>
<p>一个非常优秀的歌手</p>
<a href="https://baike.baidu.com/item/%E5%91%A8%E6%B7%B1/15089196">这个是他的介绍</a>
<a href="https://www.duitang.com/blog/?id=1333702828">
<img src="https://c-ssl.duitang.com/uploads/blog/202104/05/20210405194705_65f81.thumb.1000_0.jpg">
</a>
<hr>
</body>
</html>这个与之前不一样的点在第二个a这里首先需要找到这个图片的原来的网页，
我首先在百度中搜索这个图片，然后知道原来出自于堆糖里，非常感谢漘騟所提供的照片，然后在href后面的URL（网址）这边写上原来的网址，然后在在里面插入<img>。关于后面的那一串东西也很简单就能完成，我回到百度的照片中，然后右击鼠标出现的第一个选项（相信标签页打开照片）之后能出现这个页面
而上面的URL就是之后要写在后面的代码。
你们可以运行一下。看看结果。
1.2.4注释
最后一个小节，就是关于注释，注释的重要性，就是提醒你在很长一段时间没有关注这个代码，然后你很容易忘记掉这个代码是啥意思，在这个时候注释就发挥了自己的能力。
html的注释是
<html>
<body>
<title> Charles Wesley</title>
<h1>周深</h1>
<p>一个非常优秀的歌手</p>
<a href="https://baike.baidu.com/item/%E5%91%A8%E6%B7%B1/15089196">这个是他的介绍</a>
<a href="https://www.duitang.com/blog/?id=1333702828">
<img src="https://c-ssl.duitang.com/uploads/blog/202104/05/20210405194705_65f81.thumb.1000_0.jpg" alt="周深">
</a>
<hr>
<!-- 不重要的注释 -->
</body>
</html>在这里有一个<!-- -->这个就是关于html的注释。在网页中不回现实出来，同样这个代码也不会报错。
![动手学深度学习（pytorch）学习记录9-图像分类数据集之Fashion-MNIST[学习记录]](https://i-blog.csdnimg.cn/direct/de01322dd3cc40389e27b4c25d6a9a99.png)
