博客列表 >20200929作业-链接元素的作用以及锚点功能用途

20200929作业-链接元素的作用以及锚点功能用途

山下之石
山下之石原创
2020年09月30日 15:06:42637浏览

链接元素功能与锚点用途

1 链接元素功能

序号 语句 功能描述
1 <a href="www.baidu.com" target="_blank">跳转</a> 跳转到其他页面
2 <a href="https://img.php.cn/upload/course/000/000/001/5f59db624c2e2735.png" download="我的图片">下载网络资源</a> 下载网络资源
3 <a href="tel:18233455667">拨打电话</a> 拨打电话
4 <a href="#锚点元素ID">去锚点</a> 锚点

2 锚点用途

在页面内部定位指定元素位置

3 测试代码

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6. <title>Document</title>
  7. </head>
  8. <body>
  9. <a
  10. href="https://www.baidu.com/index.php?tn=87048150_dg&ch=1"
  11. target="_blank"
  12. >跳转</a
  13. >
  14. <a
  15. href="https://img.php.cn/upload/course/000/000/001/5f59db624c2e2735.png"
  16. download="我的图片"
  17. >下载网络资源</a
  18. >
  19. <a href="tel:18233455667">拨打电话</a>
  20. <a href="#md01">去锚点01</a>
  21. <a href="#md02">去锚点02</a>
  22. <h1 id="md01" style="margin-top: 500px">我是锚点01</h1>
  23. <h1 id="md02" style="margin-top: 1000px">我是锚点02</h1>
  24. </body>
  25. </html>

4 测试效果截图

测试效果截图

声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议