educoder平台实训---web编程训练-html5-超链接的应用-CSDN博客

本文链接：https://blog.csdn.net/m0_59076472/article/details/121589919

educoder平台实训—web编程训练-html5-超链接的应用

第1关：创建热字超链接

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8"/>
  <title>创建超链接</title>
 </head>
 <body>
   <!-- ********* Begin ******* -->
    <h2><a href="https://www.kuwo.cn/">听音乐找酷我</a></h2>
   <!-- ********* End ********* -->
 </body> 
</html>

第2关：创建热图超链接

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8"/>
  <title>创建超链接</title>
 </head>
 <body>
 <h2><a href="https://www.kuwo.cn/">听音乐找酷我</a></h2>
   <!-- ********* Begin ******* -->
    <a href="https://www.kuwo.cn/" title="单击进入" target="_blank">
      <img  align="bottom" src="https://www.educoder.net/api/attachments/2357951">
    </a>
   <!-- ********* End ********* -->
   好音质用酷我
 </body> 
</html>

第3关：下载歌曲超链接

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8"/>
  <title>创建超链接</title>
 </head>
 <body>
 <h2><a href="http://www.kuwo.cn/">听音乐找酷我</a></h2>
  <a href="http://www.kuwo.cn/"><img src=https://www.educoder.net/api/attachments/2357951  align=bottom /></a>
  好音质用酷我<br/>
   <!-- ********* Begin ******* -->
  推荐下载：  
  <a href="https://www.educoder.net/api/attachments/2364090" title="下载班得瑞钢琴曲-安妮的仙境">安妮的仙境
   <!-- ********* End ********* -->
  <p><h2>在线播放：</h2><audio src="https://www.educoder.net/api/attachments/2364090" controls="controls"></audio>
  </p>
  </a>
 </body> 
</html>

第4关：创建页内超链接

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8"/>
  <title>创建超链接</title>
 </head>
 <body>
 <h2><a href="http://www.kuwo.cn/">听音乐找酷我</a></h2>
  <a href="http://www.kuwo.cn/"><img src=https://www.educoder.net/api/attachments/2357951  align=bottom /></a>
  好音质用酷我<br/>
   <!-- ********* Begin1 ******* -->
   <a href="#Q"><h2>查看第7个音频</h2></a>
   <!-- ********* End1 ********* -->
  推荐下载：  
  <a href="https://www.educoder.net/api/attachments/2364090" title="下载班得瑞钢琴曲-安妮的仙境">安妮的仙境</a>
  <p><h2>在线播放：</h2><audio src="https://www.educoder.net/api/attachments/2364090" controls="controls"></audio>
  </p>
	 <h2>这是第1个音频</h2>
     <h2>这是第2个音频</h2>
     <h2>这是第3个音频</h2>
     <h2>这是第4个音频</h2>
     <h2>这是第5个音频</h2>
     <h2>这是第6个音频</h2>
     <h2>
    <!-- ********* Begin2 ******* -->
       <a name="Q">这是第7个音频</a>
    <!-- ********* End2 ********* -->
     </h2>
     <h2>这是第8个音频</h2>
 </body> 
</html>