将图片内嵌入Markdown文档中

将图片嵌入Markdown文档中一直是一个比较麻烦的事情。通常的做法是将图片存入本地某个路径或者网络存储空间,使用URL链接的形式插入图片:

![image][url_to_image]

这样做一个明显的麻烦之处在于处理图片与Markdown文档的一致性上。如果我们要拷贝文档,或者图片遭到误删/云端链接失效,就会变得不便。最让我们省心的方法便是将图片直接放到文档内部。

一个将图片嵌入文档中的方法是使用base64编码。步骤比较简单:

  1. 将图片或截图保存在本地;
  2. 使用在线工具将图片转码至base64编码; link1);
  3. 在文档中插入编码:
![image][data:image/png;base64, ......]

当然base64编码一般很长,直接将编码放入段落内部会影响正常编辑。通常的做法是将base64编码定义到一个中间变量中,将编码本体放到文档末:(示例见本站19文件存储结构网页)

![image][root_img]
continue edit your document here ... [root_img]:data:image/png;base64, ......

使用该技巧的时候需要注意,并不是所有的Markdown编辑器都支持这种方法。而且一些Markdown编辑器只支持特定的图片格式。如有道云笔记只支持png格式的图片编码。需要在保存图片文件的时候加以注意。

01将图片嵌入到Markdown文档中的更多相关文章

  1. 将图片嵌入到markdown文档中

    转自KFXW的专栏 将图片嵌入Markdown文档中一直是一个比较麻烦的事情.通常的做法是将图片存入本地某个路径或者网络存储空间,使用URL链接的形式插入图片: ![image][url_to_ima ...

  2. 如何在Markdown文档中插入空格?

    简单说 在 Markdown 文档中,可以直接采用 HTML 标记插入空格(blank space),而且无需任何其他前缀或分隔符.具体如下所示: 插入一个空格 (non-breaking space ...

  3. python实现解析markdown文档中的图片,并且保存到本地~

    背景 前阵子简书好像说是凉了,搞得我有点小慌,毕竟我的大部分博客都是放在简书上面的,虽然简书提供了打包导出功能,但是只能导出文字,图片的话还是存在简书服务器上面,再加上我一直想要重新做一个个人博客,于 ...

  4. 使用Python从Markdown文档中自动生成标题导航

    概述 知识与思路 代码实现 概述 Markdown 很适合于技术写作,因为技术写作并不需要花哨的排版和内容, 只要内容生动而严谨,文笔朴实而优美. 为了编写对读者更友好的文章,有必要生成文章的标题导航 ...

  5. net9:图片变成二进制流存入XML文档,从XML文档中读出图片以及从XML文档中读取并创建图片文件

    原文发布时间为:2008-08-10 -- 来源于本人的百度文章 [由搬家工具导入] fileToXml类: using System;using System.Data;using System.C ...

  6. C#解析Markdown文档,实现替换图片链接操作

    前言 又是好久没写博客了 其实也不是没写,是最近在「做一个博客」,从2月21日开始,大概一个多星期的时间,疯狂刷进度,边写代码边写了一整系列的博客开发笔记,目前为止已经写了16篇了,然后上3月之后工作 ...

  7. 【Win 10应用开发】把文件嵌入到XML文档

    把文件内容嵌入(或存入)到XML文档中,相信很多朋友会想到把字节数组转化为Base64字符串,再作为XML文档的节点.不过,有人会说了,转化后的base64字符串中含有像“+”这样的符号,写入到XML ...

  8. IT兄弟连 HTML5教程 CSS3揭秘 在HTML文档中放置CSS的几种方式

    有很多方法将样式表加入到HTML中,每种方法都有自己的优点和缺点.新的HTML元素和属性已被加入,以允许样式表与HTML文档更简易地组合起来.将样式表加入到HTML中的常用方法有内联样式表.嵌入一张样 ...

  9. vscode使用Markdown文档编写

    首先安装vscode工具,具体的使用可以参考之前的博文:<Visual Studio Code教程:基础使用和自定义设置> VScode已经默认集成markdown文档编辑插件.可以新建一 ...

随机推荐

  1. 分布式Job系统Hangfire

    开源分布式Job系统,调度与业务分离-如何创建一个计划HttpJob任务   项目介绍: Hangfire:是一个开源的job调度系统,支持分布式JOB!! Hangfire.HttpJob 是我针对 ...

  2. 066 Plus One

    给定一个非负整数组成的非空数组,给整数加一.可以假设整数不包含任何前导零,除了数字0本身.最高位数字存放在列表的首位.详见:https://leetcode.com/problems/plus-one ...

  3. 线段树 & 题目

    首先说下我写的线段树吧. 我是按照线段树[完全版]那个人的写法来写的,因为网上大多数题解都是按照他的写法来写. 确实比较飘逸,所以就借用了. 节点大小是maxn是4倍,准确来说是大于maxn的2^x次 ...

  4. PHP&Java 调用C#的WCF

    步骤一:用C#声明WCF [ServiceContract] public interface IService1 { [OperationContract] void DoWork(); [Oper ...

  5. 在写fegin客户端的时候无法继承接口

    仔细查看fegin是不是写成类了,要接口才行

  6. Joda-Time简介

    Joda-Time提供了一组Java类包用于处理包括ISO8601标准在内的date和time.可以利用它把JDK Date和Calendar类完全替换掉,而且仍然能够提供很好的集成. Joda-Ti ...

  7. Error occurred while loading plugins. CLI functionality may be limited.

    npm install --save-dev --save-exact @ionic/cli-plugin-ionic-angular@latest @ionic/cli-plugin-cordova ...

  8. App配置页面头部

    记录一下 App配置页面头部 例 上图红色框部分就是自己配置的头部 //我的客户 "/OACustomer/Index": { title: "我的客户", h ...

  9. css常用操作

    对齐操作 1.使用margin属性进行水平对齐     margin-left:auto;    margin-right:auto; 2.使用position属性进行左右对齐      3.使用fl ...

  10. javascript组件封装中一段通用代码解读

    有图有真相,先上图. 相信很多想去研究源码的小伙伴一定被这段代码给吓着了把,直接就打消了往下看下去的想法.我刚开始看的时候也是有点一头雾水,这是什么东东这么长,但是慢慢分析你就会发现其中的奥秘,且听我 ...