您当前的位置:首页 > 网络教程 > HTML教程

8.1 超链接简介

<a> 标签定义超链接,用于从一张页面链接到另一张页面。

链接的 HTML 代码很简单。它类似这样:

<a href="url">链接文本</a>

一、<a> 标签的 href 属性

<a> 元素最重要的属性是 href 属性,它指示链接的目标。

举例:

<!DOCTYPE html>
<html lang="zh">
    <head>
        <meta charset="utf-8">
        <title>超链接</title>
    </head>
    <body>
       <ul>
       <li><a href="https://www.zixun.com">未被访问的链接带有下划线而且是蓝色的</a></li>
       <li><a href="https://www.qingqingblog.com">已被访问的链接带有下划线而且是紫色的</a></li>
       </ul>
    </body>
</html>

运行浏览器后得到的效果如图

8.1 超链接简介

附加说明:添加a标签后,文本都是带下划线的,并且默认颜色是蓝色的。如果是访问过的链接,颜色是紫色的。

二、<a> 标签的 target 属性

<a> 标签的 target 属性规定在何处打开链接文档。

举例(打开新窗口

<!DOCTYPE html>
<html lang="zh">
    <head>
        <meta charset="utf-8">
        <title>超链接</title>
    </head>
    <body>
        <a href="https://www.qingqingblog.com" target="_blank">杨青青个人博客</a>
    </body>
</html>

运行浏览器后得到的效果如图:

点击“杨青青个博客”后,浏览器会新建一个窗口打开链接地址,而不是就在当前页打开。这种打开新窗口的方式在网站是最常用的。

属性值

描述
_blank 在新窗口中打开被链接文档。
_self 默认。在相同的框架中打开被链接文档。
_parent 在父框架集中打开被链接文档。
_top 在整个窗口中打开被链接文档。
framename 在指定的框架中打开被链接文档。

附加说明:在HTML中,我们常用的是属性值是_blank,也就是打开新的窗口。其他的可以作为一个了解就行。

你觉得文章内容怎么样

阿里云代金券 100 云产品通用

有效期30天 首购用户

立即领取
阿里云代金券 100 云产品通用

有效期30天 复购+升级

立即领取