今天学习了利用<a>标签从一个页面链接到另一个页面。<a>元素的内容会成为web页面中可单击的文本。
超链接的语法格式
<a href="跳转目标" target="目标窗口的弹出方式"> 文本或图像</a>
<a>标签实现后,在页面内只需要点击相应的文字或图像就会跳转到新的页面。
- href属性
用于指定链接目标的url地址。是必须属性,当标签应用href属性时就有了超链接的功能。
- target属性
用于指定链接页面的打开方式,其中_self为默认值(在当前页面跳转至新页面),_blank为在新窗口中打开页面。
链接的分类
- 外部链接
在页面内放外部链接是有语法要求的。
<a href="http://www.baidu.com">百度知道</a>我在使用edge浏览器运行该页面时没有出现错误,但是尝试点入外部链接时会弹出找不到文件的提示。在尝试打开内部链接时没有问题。在论坛上也找不到类似的问题解决方案,等我找到解决方法后再更新。
用谷歌浏览器运行时一切正常。
- 内部链接
网站内部页面之间的相互链接,直接链接内部页面名称即可。
<a href="index.html">首页</a>- 空链接
如果当前没有确定的链接目标,链接用#号代替。
<a href="#">简介</a>
- 下载链接
如果href里面的地址是一个文件或者压缩包,会下载这个文件。
如果文件或压缩包与html文件处于同一级,只需要在href内写上名字即可。
<a href="html.zip">下载链接</a>- 网页元素链接
在网页内的各种元素,比如文本、图像、表格、音频、视频等都可以添加超链接。
下面用图片链接作为代码示例:
<a href="index.html"><img src="images.jpg"/></a>- 锚点链接
点击该链接可以快速定位到页面中的某个位置。
第一步:在链接文本的href属性中,设置属性值为#名字的形式,比如:
<a href="#two">第二部分</a>#号后面带得名字可以自己决定,但是必须跟在#号后面。第二步:找到目标位置标签,里面添加一个id属性 = 第一步中所命名的名字,比如:
<h2 id="two">第二部分内容</h2>