HTML 链接

HTML 使用超级链接与网络上的另一个文档相连。几乎可以在所有的网页中找到链接。点击链接可以从一张页面跳转到另一张页面，是一种最常见的页面跳转方式。

示例：

HTML使用标签来设置超文本链接。

超链接可以是一个字，一个词，或者一组词，也可以是一幅图像，我们可以点击这些内容来跳转到新的文档或者当前文档中的某个部分。当我们把鼠标指针移动到网页中的某个链接上时，箭头会变为一只小手。

在标签中使用了 href 属性来描述链接的地址。默认情况下，链接将以以下形式出现在浏览器中：

一个未访问过的链接显示为蓝色字体并带有下划线。
访问过的链接显示为紫色并带有下划线。
点击链接时，链接显示为红色并带有下划线。

需要注意的是，链接文本（即和之间的文本内容）并不一定是文字，也可能是一张图片。

target 属性

使用 target 属性，可以定义被链接的文档在何处显示。如果不设置 target 属性的值，默认在当前页打开，如本文第一张图所示，点击链接跳转到我的博客时，会在当前页面打开我的博客。

target 属性的取值为：

取值	描述
_blank	跳转到新的文档页面，就相当于打开了新的页面
_self	在当前页打开跳转链接，是标签的默认打开方式
_parent	在父窗口上的方式跳转，如果父窗口是 window 对象的话，那么效果和 _self 相同
_top	跳转出包含这个超链接的窗口，如果页面被固定在框架之内，那么 _top 可以跳出当前框架


html>
<html>
<head>
    <meta charset="UTF-8">
    <title>HTML 链接示例title>
head>
<body>
    <p>
        <i>在当前页打开链接i>
        <br />
        <a href="https://blog.csdn.net/jiaomubai?spm=1010.2135.3001.5343">跳转到我的博客a>
        <br />
        <a href="https://www.runoob.com/">跳转到菜鸟教程首页a>
    p>
    <hr />
 
    <p>
        <i>在新标签页中打开链接i>
        <br />
        <a href="https://blog.csdn.net/jiaomubai?spm=1010.2135.3001.5343", target="_blank">跳转到我的博客a>
        <br />
        <a href="https://www.runoob.com/", target="_blank">跳转到菜鸟教程首页a>
    p>
    <hr />
 
body>
html>

id 属性

id 属性可用于创建一个 HTML 文档书签。个人觉得可以理解为目录。示例：

点击 "查看章节2" 可跳转到章节2所在部分。

图片链接


html>
<html>
<head>
    <meta charset="UTF-8">
    <title>HTML 链接示例title>
head>
<body>
    <p>
        <i>在当前页打开链接i>
        <br />
        <a href="https://blog.csdn.net/jiaomubai?spm=1010.2135.3001.5343">跳转到我的博客a>
        <br />
        <a href="https://www.runoob.com/">跳转到菜鸟教程首页a>
    p>
    <hr />
 
    <p>
        <i>在新标签页中打开链接i>
        <br />
        <a href="https://blog.csdn.net/jiaomubai?spm=1010.2135.3001.5343", target="_blank">跳转到我的博客a>
        <br />
        <a href="https://www.runoob.com/", target="_blank">跳转到菜鸟教程首页a>
    p>
    <hr />
 
    <p>
        <a href="#C2">查看章节 2a>
        <br />
        <h2>章节 1h2>
        <p>章节1的内容......p>
        <br />
        <h2><a id="C2">章节 2a>h2>
        <p>章节2的内容......p>
        <br />
        <h2>章节 3h2>
        <p>章节3的内容......p>
        <br />
        <h2>章节 4h2>
        <p>章节4的内容......p>
        <br />
        <h2>章节 5h2>
        <p>章节5的内容......p>
        <br />
        <h2>章节 6h2>
        <p>章节6的内容......p>
    p>    
    <hr />
 
    <p>
        <i>创建有边框图片链接:i>
        <a href="https://www.runoob.com/", target="_blank">
        <img border="10" src="resource\picture\picture1.gif" alt="HTML 教程" width="32" height="32">a>
        <br />
        <i>创建无边框的图片链接:i>
        <a href="https://www.runoob.com/", target="_blank">
        <img border="0" src="resource\picture\picture1.gif" alt="HTML 教程" width="32" height="32">a>
    p>
    <hr />
 
body>
html>

文章参考自：HTML 链接 | 菜鸟教程

相关阅读:
linux操作Swap
Rethinking on Multi-Stage Networks for Human Pose Estimation 源码分析
运用精益管理思想提升MES管理系统建设水平
.net8 blazor auto模式很爽（五）读取sqlite并显示（2）
CLUE模型如何实现对未来土地利用/土地覆盖的时空预测
ldapsearch工具介绍及示例
二阶段面试题——JavaScript
python 获取本机ip
Java表达式及Java块
如何解决 Critical dependency: the request of a dependency is an expression ？

原文地址：https://blog.csdn.net/jiaomubai/article/details/126957480