a元素
超链接
什么是超链接
超级链接在本质上属于一个网页的一部分,它是一种允许我们同其他网页或站点之间进行连接的元素。各个网页链接在一起后,才能真正构成一个网站。所谓的超链接是指从一个网页指向一个目标的连接关系,这个目标可以是另一个网页,也可以是相同网页上的不同位置,还可以是一个图片,一个电子邮件地址,一个文件,甚至是一个应用程序。而在一个网页中用来超链接的对象,可以是一段文本或者是一个图片。当浏览者单击已经链接的文字或图片后,链接目标将显示在浏览器上,并且根据目标的类型来打开或运行。
它们从一开始就一直是互联网的一个特性,使互联网成为互联的网络。超链接使我们能够将我们的文档链接到任何其他文档(或其他资源),也可以链接到文档的指定部分,我们可以在一个简单的网址上提供应用程序(与必须先安装的本地应用程序或其他东西相比)。几乎任何网络内容都可以转换为链接,点击(或激活)超链接将使网络浏览器转到另一个网址(URL)。
现在我们以csdn界面为例,可以看到有许多链接各自连到不同博客、网站的其它地方(导览功能),或者登入/注册页面(用户工具)等等。
herf 属性
Hypertext reference (引用)
链接类型
- (跳转地址)普通链接:普通链接是指从一个网页指向一个目标的连接关系,而在一个网页中用来链接的对象,可以是一段文本或者是一个图片.当浏览者单击已经链接的文字或图片后,链接目标将显示在浏览器上,并且根据目标的类型来打开或运行,此种链接下用户可以明白地了解到设链网站和被设链网站的关系。
- (跳转到某个锚点)锚链接:锚点链接是超链接中的一种。锚点的妙处之一在于,你可以使用它链接到文档中的某个特定位置。例如,有些网页内容较多,页面过长,用户需要不停的使用浏览器上的滚动条来查看文档中的内容。这时为了增强用户体验,可以在网页中插入锚点链接。
- 功能链接 :点击后,触发某个功能
- 执行JavaScript代码,JavaScript:
- 发送邮件:mailto
- 要求用户计算机上安装有邮件发送软件:exchange
- 拨号,tel:
- 要求用户计算机安装拨号软件,或者使用移动端访问
浏览器支持
基本上所有主流浏览器都能支持,例如:
- edge浏览器
- chrome浏览器
- opera浏览器
- firefox浏览器
- safari浏览器
- 360浏览器
- 其他浏览器
语法
<a href="URL">
ID属性:全局属性,表示元素在文档中的唯一编号
- 这里教大家一种新方法速写
((h2[id="chpter$"]>{章节$})+p>lorem)*6
相当于
<h2 id="chpter1">章节1</h2>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Nulla porro cum sint quos, debitis adipisci perferendis sed eveniet autem libero impedit sequi a, omnis recusandae pariatur ad cupiditate! Aspernatur, provident?</p>
<h2 id="chpter2">章节2</h2>
<p>Aut temporibus, amet nisi, expedita laborum qui, accusantium laboriosam magni officiis soluta corporis! Dignissimos labore eos alias voluptatum nisi maiores eligendi, vel perspiciatis, quod doloremque error eius, ad dicta odio.</p>
<h2 id="chpter3">章节3</h2>
<p>Eaque reiciendis, aliquam repellat voluptatum dicta facere labore animi blanditiis molestias similique earum omnis quae sequi adipisci et, quasi accusamus cupiditate! Voluptate accusamus sunt possimus sequi nostrum, iusto nobis necessitatibus.</p>
<h2 id="chpter4">章节4</h2>
<p>Obcaecati eius quis sed officiis voluptate labore accusamus ipsa consequuntur enim, mollitia tempora corrupti, nobis, ab modi. Temporibus cumque atque, vel sit aut voluptatem eveniet expedita delectus. In, esse. Magni.</p>
<h2 id="chpter5">章节5</h2>
<p>Alias consequatur blanditiis ipsum dicta, aut quo impedit consectetur corrupti aliquid necessitatibus rerum aliquam soluta at voluptatum consequuntur incidunt quisquam beatae quam dolore asperiores, assumenda nulla explicabo. Praesentium, dolore maxime.</p>
<h2 id="chpter6">章节6</h2>
<p>Eum consequatur corporis soluta, eos voluptatem enim asperiores magnam incidunt accusantium obcaecati maxime, libero dolorem debitis repudiandae in quasi deserunt praesentium voluptates quam maiores placeat! Nostrum excepturi eveniet iste quidem.</p>
target属性
表示跳转窗口位置
target的取值:
- _self:在当前窗口页面打开,默认值
口位置
target的取值: - _self:在当前窗口页面打开,默认值
- _blank:在新窗口中打开
相关链接:
href-mdn
link:外部资源链接元素
HTML href 属性