HTML06：超文本链接

最新推荐文章于 2024-04-24 14:53:02 发布

MNox

最新推荐文章于 2024-04-24 14:53:02 发布

阅读量232

点赞数

分类专栏：前端三剑客文章标签：前端 html

本文链接：https://blog.csdn.net/m0_62820255/article/details/130262491

版权

前端三剑客专栏收录该内容

19 篇文章 0 订阅

订阅专栏

使用标签<a>。

超链接可以是一个字、一个词、一幅图像，点击这些内容来跳转新的文档或者当前文档中的某个部分。

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

属性：

1、herf：描述链接的地址

默认情况下，将以以下形式出现在浏览器中：

①一个从未被访问过的链接显示为蓝色字体并带有下划线。

②访问过的链接显示为紫色并带有下划线。

③点击链接时，链接显示为红色并带有下划线。

后期可通过css样式改掉这些效果。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <a href="https://www.bilibili.com/">B站</a>
</body>
</html>

点击后：

也可以以图片为超链接：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <a href="https://www.bilibili.com/">B站</a>

    <a href="https://movie.douban.com/subject/35608160/">
        <img src="p2831307612.jpg" alt="" width="300px">
    </a>
</body>
</html>

超链接表现：

当鼠标移动到网页中某个链接时，箭头会变成一只小手。

MNox

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML06：超文本链接

超链接可以是一个字、一个词、一幅图像，点击这些内容来跳转新的文档或者当前文档中的某个部分。①一个从未被访问过的链接显示为蓝色字体并带有下划线。当鼠标移动到网页中某个链接时，箭头会变成一只小手。③点击链接时，链接显示为红色并带有下划线。②访问过的链接显示为紫色并带有下划线。后期可通过css样式改掉这些效果。1、herf：描述链接的地址。
复制链接

扫一扫