web/浏览器_/浏览体验优化工具扩展/html5网页大纲生成工具/文档独立滚动大纲生成插件(headingsMap)

文章目录

• ​​方式1(推荐)​​

• ​​效果​​

• ​​方式2(简单版)​​

• ​​用法​​
• ​​效果​​

• ​​插件版​​

• ​​沉浸式阅读插件​​

• ​​在这里插入图片描述​​

• ​​前端调试工具增强​​

• 为网页内容建立/生成(可以独立滚动的)目录/大纲(基于h5的各级标题)
• 利用大纲,一边本地浏览)

方式1(推荐)

• ​​HeadingsMap - Microsoft Edge Addons​​

效果

这是我使用该插件为Django4参考文档生成的大纲

• (可以独立滚动
• 点击三角号可以折叠
• 点击大纲标题可以在本网页内跳转到对应位置(类似于锚点)
• 可以设置主题(light/dark)
• 简单易用
  

方式2(简单版)

​​http://h5o.github.io/​​

用法

效果

可以看到,点击该工具网站提供的书签,右上角生成当前浏览的网页的大纲
对于markdown也适用
ps:

微软和google的文档在导航方面做的不错,但是在本页内容的大纲不是特别细致,可以借助这个功能更好的把握当前页面的内容.

插件版

• 插件可以滚动,功能稍微好一点,但是还是不如第一个来的好)
  

沉浸式阅读插件

• ​​Reader View - add0n.com​​
• ​​Circle reader - Microsoft Edge Addons​​

• 功能最强,但是部分功能收费(主题自定义相关)
• 可以跳转字体/页面宽度/生成独立大纲(左侧自动收起/也可以钉住)

前端调试工具增强

• ​​VisBug - Microsoft Edge Addons​​