上一节我们说了相对路径、绝对路径，今天我们说下内部链接的使用。什么是内部链接呢？内部链接就是网站内部页面之间的相互链接，直接链接内部页面名称即可，比如: <a href="index.html">首页名称</a>
我们写一个例子:
效果如下:
点击内部链接后，显示内部链接内容
这里默认是当前页面打开，如果加上 target = "_blank"就是新打开一个页面
内部链接不需要加上http或者https的前缀。
如果开发时还不知道要跳转到哪个链接，输入一个 "#"后即可，相当于一个空链接，但同时又占了一个位置。看下示例:
我们点击空链接后，虽然页面没动，但是可以看下链接地址变了
file:///E:/LiePinCode/html/html_6.html#
接着我们看下下载链接，如果href里面地址是一个文件或者是压缩包，会下载这个文件。我们来试下
但是点击后发现文件没有下载，这是怎么回事呢？
先换个文件类型试试，比如 .exe或者zip 试了之后发现都不行，难道又是浏览器的问题？那换谷歌浏览器吧
果然，谷歌浏览器就可以了
可以看到zip文件下载成功了，估计还是跟火狐浏览器的安全性有关系。我们再试下刚才的xmind文件是否可以下载成功吧
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>20210822_九</title>
</head>
<body>
<h3>下载一个文件</h3>
<a href="E:\猎聘\测试用例\20201207需求.zip">文件下载</a>
<br/>
<a href="E:\猎聘\测试用例\PC端谁看过我功能下线.xmind">试下之前的用例是否可以</a>
</body>
</html>
原来是可以的，说明就是浏览器的问题，那接下来我们就默认使用谷歌浏览器来操作和演示了。在网页中的各种网页元素，都可以添加超链接，比如音乐、视频、文本、图像、表格等。我们再给图片加一张超链接
代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>20210822_九</title>
</head>
<body>
<h2>图片超链接</h2>
<a href="HTML5.jpeg">图片超链接</a>
<h3>下载一个文件</h3>
<a href="E:\猎聘\测试用例\20201207需求.zip">文件下载</a>
<br/>
<a href="E:\猎聘\测试用例\PC端谁看过我功能下线.xmind">试下之前的用例是否可以</a>
</body>
</html>
再看另外一种效果:
点击图片后跳转到链接
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>20210822_九</title>
</head>
<body>
<h2>图片超链接</h2>
<a href="https://www.baidu.com"><img src="HTML5.jpeg"></a>
<h3>下载一个文件</h3>
<a href="E:\猎聘\测试用例\20201207需求.zip">文件下载</a>
<br/>
<a href="E:\猎聘\测试用例\PC端谁看过我功能下线.xmind">试下之前的用例是否可以</a>
</body>
</html>
代码如上
然后我们说下锚点链接: 点击锚点链接，可以快速定位到某个位置。
- 在链接文本的 href属性中，设置属性值为 "#名字"的形式，如<a href = "#你好">你是一个好人</a>
- 找到目标位置标签，里面添加一个id属性，等于刚才id的名字，如<h2 id = "你好">我是一个标题</h2>
我们来举个例子试下:
点击标题三，跳转到标签三或者段落三
看下代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>20210822_九</title>
</head>
<body>
<h1>标题一</h1>
<h2>标题二</h2><br>
<a href = "#life">标题三(有锚点)</a><br>
<h4>标题四</h4>
<p>段落一</p>
1.今天天气特别好<br>
1.今天天气特别好<br>
1.今天天气特别好<br>
1.今天天气特别好<br>
1.今天天气特别好<br>
1.今天天气特别好<br>
1.今天天气特别好<br>
1.今天天气特别好<br>
1.今天天气特别好<br>
<p>段落二</p>
2.今天下雨了<br>
2.今天下雨了<br>
2.今天下雨了<br>
2.今天下雨了<br>
2.今天下雨了<br>
2.今天下雨了<br>
2.今天下雨了<br>
2.今天下雨了<br>
2.今天下雨了<br>
2.今天下雨了<br>
<h5>锚点要跳转到的标签</h5>
<p>段落三</p>
3.生活有点甜，锚点会来这一段，相信我<br>
3.生活有点甜，锚点会来这一段，相信我<br>
3.生活有点甜，锚点会来这一段，相信我<br>
3.生活有点甜，锚点会来这一段，相信我<br>
3.生活有点甜，锚点会来这一段，相信我<br>
3.生活有点甜，锚点会来这一段，相信我<br>
3.生活有点甜，锚点会来这一段，相信我<br>
3.生活有点甜，锚点会来这一段，相信我<br>
3.生活有点甜，锚点会来这一段，相信我<br>
<p id="life">段落四</p>
4.你懂个p
</body>
</html>
好的，今天先到这里