MARKDOWN-插入图片

MARKDOWN-插入图片

1 markdown是什么

Markdown 是一种轻量级标记语言,创始人为约翰·格鲁伯(John Gruber),它允许人们使用易读易写的纯文本格式编写文档,然后转换成有效的HTML文档。
 

2 markdown 插入图片的三种方式

2.1 插入本地图片

只需要在markdown插入图片语法的括号中填入图片本地路径:

![Alt text](本地图片位置路径)
eg: ![avatar](C:\Users\pgong\Pictures\30972457.png)

Alt text:图片的Alt标签,用来描述图片的关键词,可以不写。
缺点:不灵活不好分享,本地图片的路径更改或丢失都会造成markdown文件调不出图。

2.2 插入网络图片

只需要在markdown插入图片语法的括号中填入图片网络链接:

![Alt text](网络图片链接)
eg: ![avatar](http://baidu.com/pic/doge.png)

缺点:图片存在网络服务器上,非常依赖网络。

2.3 把图片存入markdown文件

鉴于前两种方法存在的问题,现在推荐第三种方法:首先把图片转换成一段 base64 字符串,然后把字符填入 markdown 插入图片基础语法中的括号里。基础用法如下:

![Alt text](iVBORw0K......)

但是你会发现,base64字符串很长,这么长一段字符串横在文档中间,一定十分影响文档编辑体验,所以推荐如下方式:把大段的 base64 字符放在末尾,通过一个 ID 来调用:

![avatar][base64str]
[base64str]:data:image/png;base64,iVBORw0K......

3 如何得到图片的 base64 字符串呢

python 代码如下:

python image2base64.py  "图片的本地路径"
eg: python image2base64.py "C:\Users\pgong\Pictures\30972457.png"
# 会在图片目录下得到一个与图片名相同 base64 的 .txt 文件
# coding = UTF-8
# image2base64.py

"""
this will  convert image file to Base64 string
"""

import os
import base64
import argparse

#def get_filename(absolute_path):


def write_to_txt(string,filename): #(base64字符串,绝对路径文件名)
    (dir_name,base_filename) = os.path.split(filename)
    base_filename = os.path.splitext(base_filename)[0]
    suffix = '_base64.txt'
    txt_name = os.path.join(dir_name,base_filename + suffix ) #拼接包含路径的 txt 文件名
    #print(txt_name)
    #print(dir_name)
    f = open(txt_name,'w')
    f.write(string)
    f.close


def convert(filename):
    f=open(filename,'rb') #二进制方式打开图文件
    ls_f=base64.b64encode(f.read()) #读取文件内容,转换为base64编码
    write_to_txt(ls_f,filename)
    f.close()


def get_parser():
    parser = argparse.ArgumentParser(description='change extension of files in a working directory')
    parser.add_argument('filename', metavar='FILENAME', type=str, nargs=1, help='photo`s filename')
    return parser


def main():
    parser = get_parser()
    args = vars(parser.parse_args())
    filename = args['filename'][0]
    convert(filename)


if __name__ == '__main__':
    main()
  • 0
    点赞
  • 12
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
vsc-markdown-image是Visual Studio Code(简称为VSC)中一个用于插入和管理Markdown文件中的图片的插件。下面是关于如何使用vsc-markdown-image的方法: 1. 首先,在安装好Visual Studio Code之后,打开软件并在插件商店搜索vsc-markdown-image插件进行安装。 2. 安装完成后,在Visual Studio Code的侧边栏找到“扩展”图标(形状为方块),点击展开扩展视图。 3. 在扩展视图的搜索栏中输入“vsc-markdown-image”来找到这个插件。点击插件旁边的“设置”图标,进入该插件的配置界面。 4. 在配置界面中,你可以设置默认路径或者使用相对路径来保存图片。你可以选择将图片复制到当前文件夹,或者将其保存到指定的文件夹中。同时,你还可以设置图片的名称前缀和拓展名。 5. 当你编辑Markdown文件时,可以使用以下方式插入和管理图片: - 直接使用快捷键Ctrl + Alt + V,或者右键点击图片位置,选择“插入图片”,然后选择需要插入的图片。 - 在Markdown文档中使用`![图片描述](图片路径)`的语法来插入图片。图片路径可以是绝对路径,也可以是相对路径,视你的配置而定。 6. 插入图片后,你可以点击图片,然后按下Ctrl + Shift + P键(Mac为Cmd + Shift + P),在命令面板中选择“vsc-markdown-image: 当前图片操作”来对图片进行操作,如重命名、移动、复制等。 7. 如果你更新了图片或者需要删除图片,可以右键点击图片,选择相应的选项进行操作。 通过上述步骤,你就可以方便地在Visual Studio Code中使用vsc-markdown-image插件来插入和管理Markdown文件中的图片了。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值