1：标签的概念
在别人写的网页中我们会看到许多文字，图片排版整齐，让人看的赏心悦目，这就是用到了标签，或者说标签就是帮我们实现某种作用的工具，比如制作段落，换行，导入图片，视频，链接等等，我们可以就把标签粗略的理解成是以一种帮我们实现某种功能的工具。
2：基本标签的使用
（1）段落标签和换行标签
段落标签有六种，从大到小是：
<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>
这里的从大到小的意思指的是标题的重要性，<h1></h1>表示的是最重要的段落标签
换行标签是<br>，在HTML中换行回车换行并不能在网页中换行，而是需要<br>，即使在
代码中换行，它也只可能将其当做是空格
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>
第一
</h1>
<h2>
第二
</h2>
<h3>
第三
</h3>
<h4>
第四
</h4>
<h5>
第五
</h5>
<h6>
第六，也是最小
</h6>
hjnksnd ksd sdn
<br> sd
</body>
</html>
（2）文本格式化标签
文本格式化我们暂且知道四种就行了。
<strong></strong> 字体加粗
<em></em> 字体倾斜
<del></del> 字体加删除线
<ins></ins> 字体加下划线<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<strong>jkjk</strong><br>
<em>sddddd</em><br>
<del>LLLLLLLL</del>
<br><ins>opopopopooo</ins>
</body>
</html>
（3）div和span标签
div和span就是相当于是一个容器箱子，div可以理解成是个大箱子，span理解成是个小箱子。div装的东西在一行中只能是div中的东西。而span在一行中还可以放其它的东西，不过防置的东西回合span箱子中的东西加个空格。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div>ksldlsd</div>
sdsdf opop
<br>
<br>
<br>
<span>klk</span> sdsdfsd X-UA-Compatible xcs
<br>
<span>sd</span>
<span>ioi</span>
<span>pppppp</span>
</body>
</html>
（4）图像标签
图像标签可以将图片插入到我们所要设计的网页中，插入的时候只要将对应的图片路径写到图像标签中即可。
<img src="图片的路径"(后面可以写一些其他的属性)>同时图像标签还有其他的属性
alt 替换文本，图像不能显示时，便显示该文字
title 提示文本，鼠标放到图像上，显示文字
width 设置图像的宽度
height 设置图像的高度
border 设置图像的边框粗细<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div>ksldlsd</div>
<img src="D:\html\html_first\image_1\img.jpg" alt="显示不出来">
<br>
<img src="D:\html\html_first\image_1\img.jpg" alt="无法显示" title="牛逼" width="100">
</body>
</html>
（5）链接标签
对于链接标签，它的作用就是点击了之后可以实现相对应作用，如跳转页面等等，所以链接标签也是可以分类的。
1：外部链接
外部链接就是可以跳转到其他页面，网址之类的。
<a href="填写网址" target="新窗口的弹出方式">链接名称或者是图片</a>
新窗口的弹出方式有两种
（1）_blank 重新创建新的窗口
（2）_self 默认，将本页面换成目标链接地址<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<a href="https://qq.com" target="_blank">点击我</a>
</body>
</html>
2：内部链接：
内部链接就是跳转到自己写的网页中。如果所写的页面不在当前文件夹中，只需要加上路径即可。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<a href="first/fir_1.html" target="_blank">点击我</a>
</body>
</html>3：空链接
空链接就是没有确认链接目标所写的待确认项。
<a href="#"></a>
加个#号就行4：下载链接
如果链接里面是个压缩包或者文件，点击便可下载。
直接加上该下载文件的路径即可。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<a href="D:\html\html_first\image_1\img.zip" target="_blank">点击我</a>
</body>
</html>5：网页元素链接
给文本，图像，表格等添加超链接，点击即可跳转到该链接位置。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<a href="https://baidu.com" target="_blank"><img src="D:\html\html_first\image_1\img.jpg"></a>
</body>
</html>（6）锚点标签
锚点链接就是在本页面一段文本中添加链接，点击该链接之后可以跳转到指定的位置。
<a href="#自己取得名字">点击</a>
<h1 id="自己取得名字">跳转的位置</h1>
![[附源码]java毕业设计家庭医生系统](https://img-blog.csdnimg.cn/a5f9675c122a487ea2da5d76dfd01348.png)
