Web前端第一季(HTML):七:课时 17 : 116-超级链接+课时 18 : 117-超级链接的属性+课时 19 : 118-超链接的其他内容

最新推荐文章于 2024-09-10 09:55:59 发布

Smart_zy

最新推荐文章于 2024-09-10 09:55:59 发布

阅读量128

点赞数

分类专栏： HTML5 文章标签：前端 html

本文链接：https://blog.csdn.net/qq_40544338/article/details/120946809

版权

HTML5 专栏收录该内容

16 篇文章 0 订阅

订阅专栏

一.目的

1.想：学习前端知识

2.想：记录笔记，下次不用看视频，直接看笔记就可以快速回忆。

四.操作:1:成功:课时 17 : 116-超级链接

1.运行结果:成功：超级链接+站外链接

1.超级链接+站内链接

1.运行效果：空连接+图片添加超级链接+文字和图片在一起添加超级链接

四.操作:2:成功:课时 18 : 117-超级链接的属性

1.运行结果：type：_blank：在新标签页中打开网址+type：_self:在当前标签页中打开网址+title：我是超链接的标题

1.运行效果：成功：超链接和锚点

四.操作:3:成功:课时 19 : 118-超链接的其他内容

1.打开别的网址的锚点

1.下载文件+打开邮箱软件，此地址设置为发送地址

一.目的

1.想：学习前端知识

2.想：记录笔记，下次不用看视频，直接看笔记就可以快速回忆。

二.参考

1.SIKI学院:我参考此视频实操

我参考此视频实操

1.w3school官网:当做字典使用

w3school 在线教程

1.菜鸟教程：当做字典使用

菜鸟教程 - 学的不仅是技术，更是梦想！

三.注意

四.操作:1:成功:课时 17 : 116-超级链接

1.运行结果:成功：超级链接+站外链接

<!DOCTYPE html>
<html>
<head>
	<title>我是标题</title>	
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>

</head>
<body>

<p>a是 超级链接标签</p>
<p>站内/内部 链接需要使用http://</p>
<a href="http://www.baidu.com">进入百度</a>

</body>
</html>

1.超级链接+站内链接

<!DOCTYPE html>
<html>
<head>
	<title>我是标题</title>	
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>

</head>
<body>
<p>a是 超级链接标签</p>
<p>站内/内部 链接需要使用http://</p>
<a href="http://www.baidu.com">进入百度</a>

<p>站内/内部链接</p>
<a href="02段落和标题.html"> 进入到 02段落和标题 的那个网页</a>

</body>
</html>

1.运行效果：空连接+图片添加超级链接+文字和图片在一起添加超级链接

<!DOCTYPE html>
<html>
<head>
	<title>我是标题</title>	
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>

</head>
<body>
<p>a是 超级链接标签</p>

<p>站内/内部 链接需要使用http://</p>
<a href="http://www.baidu.com">进入百度</a>

<p>站内/内部链接</p>
<a href="02段落和标题.html"> 进入到 02段落和标题 的那个网页</a>

<a href="#"> 空链接  </a>

<p>图片添加超级链接</p>
<a href="https://blog.csdn.net/qq_40544338"> <img src="./img/1.jpeg" width="10%"> </a>

<p>文字和图片在一起添加超级链接</p>
<a href="https://blog.csdn.net/qq_40544338"> xzy的CSDN网址<img src="./img/1.jpeg" width="10%"> </a>

</body>
</html>

四.操作:2:成功:课时 18 : 117-超级链接的属性

1.运行结果：type：_blank：在新标签页中打开网址+type：_self:在当前标签页中打开网址+title：我是超链接的标题

1.运行效果：成功：超链接和锚点

比如小说内容太多，网址一个显示器无法显示全，所以弄了锚点，直接点击就到了指定的位置

<!DOCTYPE html>
<html>
<head>
	<title>我是标题</title>	
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>

</head>
<body>
<!-- 超链接和锚点 -->
<a href="#chapter1">第一章</a> <a href="#chapter2">第二章</a> <a href="#chapter3">第三章</a>

<a href="#" name="chapter1"></a><!-- 只起到锚点作用 -->
<h1> 第一章</h1> 
<br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br>

<a href="#" name="chapter2"></a>
<h1>第二章</h1>
<br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br>


<a href="#" name="chapter3"></a>
<h1>第三章</h1>
<br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br>

</body>
</html>

四.操作:3:成功:课时 19 : 118-超链接的其他内容

1.打开别的网址的锚点

直接跳转到 11-1超链接与锚点.html 看里面的小说第二章

<!DOCTYPE html>
<html>
<head>
	<title>我是标题</title>	
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>

</head>
<body>

<!-- 直接跳转到 11-1超链接与锚点.html 看里面的小说 -->
<p><a href="11-1超链接与锚点.html"> 《斗破苍穹》 </a></p>

<!-- 直接跳转到 11-1超链接与锚点.html 看里面的小说 第二章 -->
<p><a href="11-1超链接与锚点.html #chapter2"> 《斗破苍穹》第二章 </a></p>

</body>
</html>

<!DOCTYPE html>
<html>
<head>
	<title>我是标题</title>	
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>

</head>
<body>
<!-- 超链接和锚点 -->
<a href="#chapter1">第一章</a> <a href="#chapter2">第二章</a> <a href="#chapter3">第三章</a>

<a href="#" name="chapter1"></a><!-- 只起到锚点作用 -->
<h1> 第一章</h1> 
<br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br>

<a href="#" name="chapter2"></a>
<h1>第二章</h1>
<br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br>


<a href="#" name="chapter3"></a>
<h1>第三章</h1>
<br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br><br>我是小说的内容</br>

</body>
</html>

1.下载文件+打开邮箱软件，此地址设置为发送地址

<!DOCTYPE html>
<html>
<head>
	<title>我是标题</title>	
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>

</head>
<body>

<!-- 直接跳转到 11-1超链接与锚点.html 看里面的小说 -->
<p><a href="11-1超链接与锚点.html"> 《斗破苍穹》 </a></p>

<!-- 直接跳转到 11-1超链接与锚点.html 看里面的小说 第二章 -->
<p><a href="11-1超链接与锚点.html #chapter2"> 《斗破苍穹》第二章 </a></p>

<!-- 文件下载，如果是网页浏览器就打开，如果是压缩包浏览器就会下载 -->
<br> <a href="img.rar">下载 相对路径的img.rar文件</a> </br>

<!-- 如果是邮箱地址，会打开邮箱软件，此地址设置为发送地址，一定要有默认的邮箱软件，否则点击没有反应-->
<br> <a href="mailto:10001@qq.com">联系我们(听说是马hua腾的QQ邮箱)</a> </br>

</body>
</html>

Smart_zy

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Web前端第一季(HTML):七:课时 17 : 116-超级链接+课时 18 : 117-超级链接的属性+课时 19 : 118-超链接的其他内容

一.目的1.想：学习前端知识2.想：记录笔记，下次不用看视频，直接看笔记就可以快速回忆。二.参考1.SIKI学院:我参考此视频实操登录 - SiKi学院 - 生命不息，学习不止！我参考此视频实操1.w3school官网:当做字典使用w3school 在线教程1.菜鸟教程：当做字典使用菜鸟教程 - 学的不仅是技术，更是梦想！三.注意四.操作:1:成功:课时 17 : 116-超级链接1.运行结果:成功：超级链接+站外链接...
复制链接

扫一扫

专栏目录