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，也就是打开新的窗口。其他的可以作为一个了解就行。

网络二叔

如果缘分安排我们相遇，请不要让她擦肩而过。扫一扫二维码，加我为好友吧！

上一篇：7.2 图片格式/大小处理下一篇：8.2 锚点链接

你觉得文章内容怎么样

站长推荐

网站分类

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

有效期30天首购用户

立即领取

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

有效期30天复购+升级

立即领取