HTML5-超链接标签及应用（页面链接、锚点链接：跳转其他页面的任意位置/或者跳转回顶部、功能性链接：邮箱链接、qq链接） 

链接标签：
<a href="path" target="目标窗口位置"以>链接文本或图像<la>
>文本超链接
>图像超链接
href:链接路径
target:链接在那个窗口中打开，常用值：_self、_blank

 

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>链接标签学习</title>
</head>
<body>
  <!--使用name做一个标记-->
  <a name="top">顶部</a>
  <br/>
  <!--页面间链接：
a标签
     href：必填，表示要跳转到那个页面
    target:表示在那里打开
        _blank：在新标签页中打开网页
        _self:在自己的网页中打开
        
-->
    <a href="1.我的第一个页面.html",target="_blank">点击我跳转页面1</a>
      <a href="https://www.baidu.com",target="_self">点击我跳转百度</a>
  <br/>
  <a href="我的第一个页面">
    <!-- 图片超链接-->
    <img src="../resou/img/章节.jpg",alt="盖章图像"，title="悬停内容"></a>
  
 
  <!-- 锚链接
    当前页面间跳转：
    回到p标签内容的顶部
    1.需要一个锚标记，在body的任意创建一个锚标记，使用name做一个标记，通过#+name的名称去跳转
    2.跳转到标记:在回到顶部的链接中，路径上用#+name名字跳转锚标记顶部
-->
  <p>
    <img src="../resou/img/章节.jpg",alt="盖章图像"，title="悬停内容">
  </p>
  <p>
    <img src="../resou/img/章节.jpg",alt="盖章图像"，title="悬停内容">
  </p>
  <p>
    <img src="../resou/img/章节.jpg",alt="盖章图像"，title="悬停内容">
  </p>
  <p>
    <img src="../resou/img/章节.jpg",alt="盖章图像"，title="悬停内容">
  </p>
  
  <a href="#top">回到顶部</a>
  
  <!--跳转其他页面的用方法
    要跳转的页面名称，并且这个页面中要设置有锚点
    锚点相当于一个<a>标签，但是这个标签只设置了name值，如：<a name="top">内容</a>
    -->
  <a href="1.第一个页面.html#top">跳转</a>
  
  
  
  
 <!-- 功能必链接
    邮箱链接：mailto +邮箱地址
    qq在线咨询链接：第一在百度查找qq推广，然后登录qq,找到推广工具，设置提示语，复制代码即可
--> 
  <a href="mailto:1234112545@qq.com">跳转</a>
  <!--qq在线咨询链接 -->
  <a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=24736743&site=qq&menu=yes"><img border="0" src="http://wpa.qq.com/pa?p=2:24736743:41" alt="点击聊天" title="点击聊天"/></a>
  
  
  
  
</body>
</html>

 

posted @ 2022-06-14 11:25  hollg  阅读(1146)  评论(0)    收藏  举报