背景

在查阅一些文档的时候，一些比较优秀博客在文章中是带有目录的，点击就会跳转到指定的锚点。

在本人的某些文章中，也想尝试这样的效果。

做法

实现这样的效果有2种做法（不同之处在于 超链接的写法不同），都是一个锚点+ N个调整连接即可

  • 基于html语法
  • 基于markdown语法

html 语法

<a href="#锚点1">点击这里跳转到锚点1</a>

<a href="#锚点名2">点击这里跳转到锚点2</a>

<a id="锚点1">标题1，作为锚点1</a>

效果

点击这里跳转到锚点1

点击这里跳转到锚点2

标题1，作为锚点1

markdown 语法

写法



[点击这里跳转到锚点2](#锚点名2)

<a id="锚点名2">标题2，作为锚点2</a>

效果

点击这里跳转到锚点2

标题2，作为锚点2

Markdown 文章 跳转的更多相关文章

  1. 使用 VS Code 来编辑 markdown 文章

    一开始我就用 VS Code 来编辑 markdown 文本,只是因为 VS Code 用起来感觉很好,然后我又去寻找其他的能够预览 markdown 的编辑器,看了好多都不是很方便.突然我发现 VS ...

  2. 第 10 篇：小细节 Markdown 文章自动生成目录，提升阅读体验

    目录 在文中插入目录 在页面的任何地方插入目录 处理空目录 美化标题的锚点 URL 作者:HelloGitHub-追梦人物 文中涉及的示例代码,已同步更新到 HelloGitHub-Team 仓库 上 ...

  3. 解放双手，markdown文章神器,Typora+PicGo+七牛云图床实现自动上传图片

    本文主要分享使用Typora作为Markdown编辑器,PicGo为上传图片工具,使用七牛云做存储来解放双手实现图片的自动化上传与管理.提高写作效率,提升逼格.用过 Markdown 的朋友一定会深深 ...

  4. IOS微信中看文章跳转页面后点击返回无效

    经过查找原因发现,下面两种链接,链接1返回不了,链接2可以返回. 链接1:http://mp.weixin.qq.com/s?__biz=MzA5NDY5MzcyNA==&mid=265089 ...

  5. Markdown博文快速转为微信文章

    介绍 技术博文在CSDN上,全是Markdown格式,最近看各位大佬又是个人网站又是个人微信公众号,突然发现: "个人博客小站 + 个人微信公众号 + CSDN + 掘金+ - = 程序员标 ...

  6. 用weexplus从0到1写一个app(2)-页面跳转和文章列表及文章详情的编写

    说明 结束连续几天的加班,最近的项目终于告一段落,今天抽点时间开始继续写我这篇拖了很久的<用weexplus从0到1写一个app>系列文章.写这篇文章的时候,weexplus的作者已经把w ...

  7. Markdown 完全指南

    概述 Markdown 是一种用于网络文本书写的轻量级标记语言,广泛用于个人 blog.github.wiki 中.其实浏览器并不能识别 Markdown 的语法,但许多 blog.wiki 平台以及 ...

  8. Typora 和 markdown

    目录 Typora 和 markdown Typora 简单介绍 markdown语法 导出 Typora 和 markdown Typora 简单介绍 支持markdown的一款优雅的编辑器. 绿色 ...

  9. Python + Selenium 自动发布文章（一）：开源中国

    https://blog.csdn.net/qq_28804275/article/details/80891949 https://blog.csdn.net/qq_28804275/article ...

  10. markdown编辑器typora本地图片上传到自己的服务器

    typora是windows平台下最受欢迎的markdown书写工具和查看工具,本篇文章将会介绍如何在typora平台使用java脚本程序自动上传本地图片到自己的服务器,从而让markdown文章中的 ...

随机推荐

  1. SAP集成技术（七）集成解决方案咨询方法论（ISA-M）

    目前,ISA-M 主要以 Microsoft PowerPoint 演示文稿的形式提供.可以在 SAP Community 博客文章(https://blogs.sap.com/)以及关于ISA-M ...

  2. Solution Set - SAM

    讲解一些 SAM 经典的应用.可以结合 字 符 串 全 家 桶 中 SAM 的部分食用. 洛谷P2408 求不同子串个数.在 SAM 中,所有结点是一个等价类,包含的字符串互不相同.结点 \(u\) ...

  3. 九、DataArts Studio

    功能总览: 基本概念: 主题设计:通过分层架构表达对数据的分类和定义,帮助理清数据资产,明确业务领域和业务对象的关联关系. 主题域分组:基于业务场景对主题域分组. 主题域:互不重叠数据的高层面的数据分 ...

  4. 我用 GitHub 9.8k 的 Go 语言 2D 游戏引擎写了个游戏

    前言 hi,大家好,这里是白泽.今天给大家分享一个 GitHub 9.8k 的 Go 语言 2D 游戏引擎. https://github.com/hajimehoshi/ebiten 引擎的贡献者依 ...

  5. linux基础命令及bash shell特性

    linux基础命令及bash shell特性 目录 linux基础命令及bash shell特性 1.linux基础命令 1.1 查看内核版本和linux发行版本 1.2 查看服务器硬件信息 1.3 ...

  6. CentOS7离线部署JDK

    一. 下载JDK 官网地址: https://www.oracle.com/java/technologies/downloads/#java18 网盘地址: 链接:https://pan.baidu ...

  7. 4G EPS 中的 User Plane

    目录 文章目录 目录 前文列表 用户平面 EPS UP 中的 GTP-U F-TEID 的组成 UE IP 数据包在 GTP-U Tunnel 上的封装流程 GTP-U 与 EPS Bearer MM ...

  8. 在 JS 中调整 canvas 里的文字间距

    实现说明: 在 JS 中 canvas 原生没有支持对文字间距的调整,我们可以通过将文字的每个字符单独渲染来实现.本案例从 CanvasRenderingContext2D 对象的原型链上扩展了一个用 ...

  9. Python：Python对象模型与序列迭代陷阱

    1. Python对象模型与浅拷贝/深拷贝 1.1 Python对象模型和引用 在我们讲解Python的序列修改陷阱之前,先巩固一下Python的对象模型和浅拷贝/深拷贝的知识. 众所周知,Pytho ...

  10. 自研WPF插件系统(沙箱运行及热插拔)

    前言 插件化的需求主要源于对软件架构灵活性的追求,特别是在开发大型.复杂或需要不断更新的软件系统时,插件化可以提高软件系统的可扩展性.可定制性.隔离性.安全性.可维护性.模块化.易于升级和更新以及支持 ...