首页 > 其他分享 >轻松上手Markdown进阶:揭秘那些让你事半功倍的小秘诀!

轻松上手Markdown进阶:揭秘那些让你事半功倍的小秘诀!

时间:2024-08-07 10:27:58浏览次数:13  
标签:编码 插件 Markdown 进阶 Base64 事半功倍 文本 图片

110.其他Markdown技巧

讲讲其他关于 Markdown 的杂技。

Slidev

官网:cn.sli.dev/guide

Slidev 是一款专门为开发者打造的演示文稿工具,目前在 Github 上已有 23K+Star​。

通过 Slidev,我们只要使用熟悉的 Markdown 就可以做出炫酷的 PPT 来,同时拥有支持 HTML 和 Vue 组件的能力,并且能够呈现像素级完美的布局。

去除冗余图片

写博客的时候,经常会插入图片。如果觉得图片不合适,可以直接在编辑器中删掉该图片的引用,但是这就有一个问题:图片所在的文件夹中,对应的图片并没有被删除。

如果你使用的是思源笔记,可以很方便地在设置里去除未引用的资源(包括图片):

而 Typora 也有相关的插件,参考 github.com/obgnail/typora_plugin

如果你使用的是其他 Markdown 编辑器,那么可能只能另辟蹊径了,我随手 Google 了下,也有不少人自己动手写代码完成(其实懂编程的话并不难,特别是用 Python 的话):

再不济,也能手工删除,就是费时费力了点。

将图片转为 Base64 文本

为什么要转

在 Markdown 中,插入图片的语法是:![图片说明](图片链接)​。但这有个问题,就是图片得跟着文章走,对图片的依赖很重,例如想要发布到网上,就得先将图片上传到其他地方;而如果要发给朋友/同事,还需要连图片一起发送。

为此,我们可以改为使用内嵌图片,其原理就是将图片转为文本的形式,嵌入到文章内,这样就不用依赖其他文件了。

原理

那么如何将图片转为文本呢?我们可以使用 Base64 编码。

Base64 是一种常见的二进制数据编码方式,它将任意二进制数据转换为文本字符串,便于在网络传输、数据存储和HTML/CSS等文本环境中直接使用。此外,电子邮件协议就是文本协议,如果要在电子邮件中添加一个二进制文件(比如图片),就可以用 Base64 编码,然后以文本的形式传送。

如果想深入了解 Base64 编码,可以看我的另一篇文章:Base64编码

举个例子,这是某张图片的超链接,圆括号里的内容就是将图片进行 Base 64 编码后的内容:

![](data:image/png;base64,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)

效果:

没错,一张小小的图片,转换成文本后几乎就能霸屏.... 所以我觉得这种方式不太优雅,为此我是坚持使用图床的。

此外,如果图片太多,那么整个文章就会变的很大,慎用!

如何转

可以用一些在线网站来转(善用 Google):

也可以用第三方插件来转,例如 VSCode 有个插件叫 ClipImage64 的插件,就支持这个转换:

如果你懂编程,那么几乎任何编程语言都支持这个转换,例如 Python:

import base64
f=open('xxxxpath.jpg','rb') 
ls_f=base64.b64encode(f.read()) 
f.close()
print(ls_f)

优化

图片的 base64​ 编码非常之长,直接插入文件中间会影响文章的美观。为此,我们可以使用变量的写法。

在需要插入图片的地方写: ![][reference_name]

在任何地方(最好是文章末尾)写: [reference_name]:<base64>

效果:

然后文章的末尾定义了该图片的 Base 64 编码:

如果你有什么其他“杂技”,也欢迎留言分享

标签:编码,插件,Markdown,进阶,Base64,事半功倍,文本,图片
From: https://www.cnblogs.com/PeterJXL/p/18346533

相关文章

  • 动态规划之——背包DP(进阶篇)
    文章目录概要说明多重背包(朴素算法)模板例题思路code多重背包(二进制优化)模板例题思路code多重背包(队列优化)模板例题思路混合背包模板例题思路code1code2二维费用背包模板例题思路code概要说明本文讲多重背包、混合背包以及二维费用背包,至于其他背包问题后续......
  • Java 继承和多态(进阶介绍 十六)
    目录Java继承IS-A关系实例实例instanceof关键字HAS-A关系例子Java多态简单的例子虚方法多态的实现方式方式一:重写方式二:接口Java继承继承是所有OOP语言和Java语言不可缺少的组成部分。继承是Java面向对象编程技术的一块基石,是面向对象的三大特征......
  • Java爬虫技术:从基础到进阶的全面指南
    Java爬虫技术:从基础到进阶的全面指南大家好,我是微赚淘客返利系统3.0的小编,是个冬天不穿秋裤,天冷也要风度的程序猿!今天我们来探讨Java爬虫技术,从基础知识开始,逐步深入到进阶技术,并通过代码示例进行详细说明。一、Java爬虫的基础爬虫是一个自动化程序,旨在访问网页并提取数据。Jav......
  • 【Golang 面试 - 进阶题】每日 3 题(十九)
    ✍个人博客:Pandaconda-CSDN博客......
  • EFK之filebeat用法进阶
    接上一章节:https://blog.csdn.net/weixin_46546303/article/details/140279197?spm=1001.2014.3001.5501一、filebeatmodule输入流1.filebeatmodule作用Filebeat模块的主要作用是简化日志数据的收集和处理过程。通过使用模块,你可以快速地配置Filebeat来收集特定类......
  • markdown使用
    本人第一次在博客园发文章,这是我个人的学习笔记,我在每个知识点附上了链接,如有不懂可以打开链接。md文件创建新建txt文件,将文件后缀“txt”改为“md”。如果找不到后缀,请自行搜索解决。md文件标题创建"#"+空格+标题名,然后回车,这是一级标题。二级标题则是“##”+空格+标题名,三......
  • AI绘画进阶:ComfyUI放大技巧让你接单无忧,AI摄影写真必备
    你知道吗,现在用AI拍照和接写真单子可是个赚钱的好法子。大家都在找那种看起来超真实、艺术感十足的图片。所以,学会一些AI绘画的小技巧,尤其是用ComfyUI这种工具来放大画面的方法,简直是打开了一扇通往财富的大门。今天,我就来跟你聊聊几种超好用的ComfyUI放大技巧,保证让你的作......
  • 【Vitepress系列】-- 自定义组件及布局,配置tailwindcss、配置Markdown
    Vitepress自定义页面,以及配置tailwindcssvitepress中,除了使用一些配置项目,还可以通过写vue代码,来做一个定制化的UI。下面这个UI主页便是vue组件+tailwindcss做的一.自定义vitepress中,如果内置的home、doc、page不满足需求,还可以自己写vue代码进行自定义1.1自定义布......
  • AI绘画进阶 ComfyUI 实战教程:轻松给图片添加文字,附工作流教程使用
    大家好,我是设计师阿威在AI绘画中书写文字一直是个老大难的问题,直到SDXL的出现,文字生成才迎来转机,可以在提示词中指定一些英文字符,不过也是经常出错,生成中文就更加不可求了。本文介绍一种在图片中稳定生成文字的方法,可以自定义字体、颜色、大小,以及文字书写方向,有兴趣的同......
  • C++进阶 map和set
    目录关联式容器键值对set的介绍set的使用set的模板参数列表set的构造set的迭代器set的容量set修改操作 multiset的介绍multiset的使用map的介绍map的使用map的模板参数说明map的构造map的迭代器map的容量与元素访问map中元素的修改 multimap的介绍关联......