超链接标记
超链接指当鼠标单击一些文字、图片或者其他的网页元素时,浏览器会根据其指示载入打开一个新的页面或者跳转到其他页面。超链接除了链接到html,还可以链接到各种多媒体,比如声音、图片、动画等。通常使用 <a></a> 标记。
基本结构如下:
<a href=URL>网页元素</a>
这里的网页元素可以是文字、img图片等。
超链接的URL可以是图片、声音、视频,甚至是word文档或zip等文件,还可以是ftp协议。超链接也可以跳到其他的主机,比如 http://www.baidu.com。
设置电子邮件链接:
<a href="mailto:电子邮件地址">网页元素</a>
设置新窗口打开:
<a> 标记有一个 target 属性,它有四个值:_blank、_self、_top、_parent。在html5中由于不支持框架,所以 _top、_parent 不支持。
_blank:在新窗口打开超链接的页面。_self:在当前窗口显示超链接页面,是默认值。
本节源码
<html>
<body>
<a href="http://www.google.com" target="_blank">进入到Google</a>
<a href="../../demo03.html" target="_self">进入到demo03</a>
<p>
<a href="http://www.google.com">
<img src="../../images/eg_planets.jpg" alt="太阳系" title="浮动文字提示" width="100" />
</a>
<a href="../../wenben.rar">
文件
</a>
<a href="../../radio/music.mp3">
音乐
</a>
<a href="mailto:admin@google.com">联系我们</a>
</p>
</body>
</html>
补充说明
<a>标签之间的内容即为可点击的超链接载体,可以是文本、图片或其他行内元素href属性值可以是绝对URL(跨站点)或相对URL(同站点内),也可指向各类文件资源target="_blank"在新标签页打开链接,使用此属性时建议同时设置rel="noopener noreferrer"以避免安全风险mailto:协议会调用系统默认邮件客户端,部分移动端可能不支持- 图片作为超链接时,默认带有蓝色边框,可通过 CSS 设置
img { border: none; }去除