网站的各个HTML文档通过超链接的方式相互连接在一起,形成一个连贯的网站。用户可以通过点击超链接跳转到自己希望浏览的页面中。因此超链接在任何一个网站中都可以看到,是串联网站形成整体的核心组成部分。

锚点的布置

HTML超链接以标签作为锚点进行触发,锚点需要有一个载体,而这个载体可以是一个文字、一个词、或者一句话,也可以是图像或者某个形状。当鼠标移动到带有锚点的载体上时,鼠标会变成一个小手的状态,示意用户可以进行点击,用户点击这个锚点后会跳转到这个标签中href对应的地址上。

跳转属性的用法

在HTML链接中,使用 href 属性 可以创建指向另一个文档的链接,通常用于页面跳转。这个很常见,就不再阐述了。

使用 name 属性可以在文档内部创建书签,使超链接可以在文档内部跳转到页面的某一部分。例如:设置将其放置到页面的中间。然后在页面头部设置跳转到页面中间锚点,当用户在页面头部点击这个锚点事,页面会滚动跳转到name书签所在的位置,也就是页面中间。

HTML 链接语法

HTML链接的代码使用很简单。例如:

锚文本链接

href属性用于设定跳转的目标,开始标签和结束标签之间的文字被作为超级链接来显示。

HTML 链接的target 属性

target属性可以设定通过锚文本点击跳转后页面的打开方式。有 4 个保留的目标名称用作特殊的文档重定向操作:

_blank

浏览器总在一个新打开、未命名的窗口中载入目标文档。

_self

这个目标的值对所有没有指定目标的 标签是默认目标,它使得目标文档载入并显示在相同的框架或者窗口中作为源文档。这个目标是多余且不必要的,除非和文档标题 标签中的 target 属性一起使用。

_parent

这个目标使得文档载入父窗口或者包含来超链接引用的框架的框架集。如果这个引用是在窗口或者在顶级框架中,那么它与目标 _self 等效。

_top

这个目标使得文档载入包含这个超链接的窗口,用 _top 目标将会清除所有被包含的框架并将文档载入整个浏览器窗口。一般是用于点击iframe框架中的锚点,目标链接直接在当前页面打开,而不是在iframe中加载。

HTML链接触发桌面软件发送邮件

在href属性中加入以mailto:开头的地址,并结合目标电子邮件的地址,可以直接调用用户电脑中的默认邮件管理软件,自动填写内容并发送邮件。

其语法主要由以下几个部分组成

mailto: (发送邮件到) 后面跟随邮箱地址,例如:my@frontopen.com

? (分隔符)用于在地址后面跟随相应的参数

&;  (参数连接符)同时设置多个参数时,需要用&符号进行区分连接

cc= 、 bcc=(抄送),后面跟随需要抄送人的邮箱地址,例如:my@frontopen.com

subject=  (邮件主题)后面跟随你的邮件主题

body= (邮件内容)后面跟随需要的邮件内容

结语:本节主要讲述HTML链接的多种用法。HTML链接是网站串联多个HTML文档的核心部分,因此熟练的使用锚点跳转对于用户体验有着深远的意义。本课希望大家在学习与掌握锚点跳转的功能后,能够熟练的融入到自己的应用中去,帮助用户更好的浏览你的网站吧。

html打开软件连接的代码,《前端开发从零学起》Lesson.7 HTML中超链接的使用方法...相关推荐

  1. 网站前端开发基础知识学什么?必备技能

    网站前端开发基础知识学什么?Web前端开发网页制主要由HTML.CSS.JavaScript三大要素组成.随着企业需求变,前端开发技术的三要素也演变成现今的HTML5.CSS3.jQuery.响应式布 ...

  2. React实战开发-----一个有关兰州疫情分析的软件,本人负责前端开发,本博客记录整个开发的流程,供大家参考

    目录 前言 react介绍(觉得这些官方介绍啰嗦的直接看个人总结) 一.React的起源和发展 二.React的出发点 三.Recat与传统MVC的关系 四.React高性能的体现:虚拟DOM 五.R ...

  3. Web前端开发笔记——第二章 HTML语言 第四节 超链接标签

    目录 前言 一.超链接标签 (一)链接其它子网页 (二)链接其它站点 (三)虚拟超链接 二.从当前页面链接到指定位置 三.链接的访问情况 四.在新窗口中打开链接 例题 结语 前言 本节介绍超链接标签即 ...

  4. WEB前端开发,认认真真学4个月能学到初级吗?

    总结了一些关于这个问题不同人的回答供大家参考 web前端开发认认真真学习四个月的时间拿到初级证还是比较简单的.前端本来就不是非常的难.所以认认真真学习四个月还是有机会学完初级.web前端是一个比较简单 ...

  5. 众筹开班你说了算!UI设计+前端开发一站式打包学

    UI设计入门有几步?前端开发是开发些啥?实际工作中UI设计和前端开发是如何衔接在一起工作的?Word天,这期课程厉害了,听完干货都能直接上手参加工作了,快告诉我怎么听课! 这一回小码哥不走寻常路,干货 ...

  6. 学习web前端开发都要学什么?

    有很多初学前端的同学问我,web前端开发需要学什么?web前端开发需要学哪些软件? 关于第一个问题,很好回答.简单来说,html.css.js.html5这些是前端开发初学者必须学习会的,没有学会这些 ...

  7. php 动态彩码辨色 接口的调用_好用的云函数!后端低代码接口开发,零基础编写API接口...

    前言 在开发项目过程中,经常需要用到API接口,实现对数据库的CURD等操作. 不管你是专业的PHP开发工程师,还是客户端开发工程师,或者是不懂编程但懂得数据库SQL查询,又或者是完全不太懂技术的人, ...

  8. 2019最新传智黑马web前端开发(系统学前端)

    真正有大智慧和大才华的人,必定是低调的人.他们行走在尘世间,眼神是慈祥的,脸色是和蔼的,腰身是谦恭的,心底是平和的,灵魂是宁静的.正所谓,大智慧大智若愚,大才华朴实无华.低调,不浓,不烈,不急,不躁, ...

  9. 好用的云函数!后端低代码接口开发,零基础编写API接口

    前言 在开发项目过程中,经常需要用到API接口,实现对数据库的CURD等操作. 不管你是专业的PHP开发工程师,还是客户端开发工程师,或者是不懂编程但懂得数据库SQL查询,又或者是完全不太懂技术的人, ...

最新文章

  1. react 禁止微信调整字体大小
  2. Linux-man命令
  3. 怎样利用好单片机上的存储器资源来实现OD的存储与访问
  4. [紧急问题和解决方案] 无法打开被权限管理服务(RMS)加密的Office 2003文档
  5. torch tensor去掉1维_南昌清污机新价格表1_海腾水工
  6. mysql分页概念_MySQL学习笔记之数据定义表约束,分页方法总结
  7. 数据库的驱动配置文件
  8. caj文献格式转PDF格式
  9. JAVA 使用Dom4j 解析XML
  10. Linux系统目录的作用你了解吗?
  11. 在linux下用C语言编写贪吃蛇小游戏
  12. qpython 3h下载_【分享】QPython 3H3.0.0 一个伟大的脚本编辑器!
  13. Shell中的感叹号
  14. STM32F103X hal RTThread rtc驱动支持日期保存
  15. NFT因无意义而美丽
  16. 商标45类分类表明细表_45类商标分类明细_45类商标经营范围包括哪些商品-商标查询-知夫子...
  17. 学习之Java(方法)
  18. 计算机用word做海报,如何用Word文档做出一张简单的海报!
  19. 计算机病毒 两大传播途径,计算机病毒的传播途径
  20. vmware虚拟机动态添加硬盘识别不了新增加的硬盘

热门文章

  1. RDS SQL Server死锁(Deadlock)系列之四利用Service Broker事件通知捕获死锁
  2. 利用shell找出15分钟内修改的文件
  3. 架构师入门知识体系树
  4. Swift类属性 static
  5. Cannot load 64-bit SWT libraries on 32-bit JVM 解决方法
  6. 网络存储SAN网络存储术语解释
  7. matlab有限体积网格,用Matlab实现简单有限体积求解器
  8. uni 登录token方法_封装uni-app的须要token的要求
  9. 使用 Autofill 插件快速提交BUG
  10. 软件测试基础:自动化测试、安全测试、性能测试