Markdown插入视频、mp3音频和gif图的语法

白色玫瑰 程序猿

时间: 2023-07-11 阅读: 1 字数:5184

{}
没想到CSDN一个都不支持……

总所周知,鄙人有一个专栏叫做<a href="https://blog.csdn.net/muxuen/category_11575284.html?spm=1001.2014.3001.5482">【差生文具多】</a>,里面记录了一些工具的使用方法,以及使用工具时会遇到的一些问题。

于是乎,之前就有一个朋友在群里问道“markdown如何插入视频”,当时的我不会弄,然后就出现了下面这一幕👇 image-20220501213133756

明天就弄😂开整!(然而这篇博客是在5.1劳动节写的)

<hr>

文章目录

<a href="#1md_19">1.md插入视频</a>

<a href="#12CSDN_61">1.2CSDN博客插入视频</a>      <a href="#2mdMP3_73">2.md插入MP3文件</a>   

<a href="#21_75">2.1网易云音乐外链</a>    <a href="#22MP3_93">2.2自己的MP3音频文件</a>      <a href="#3mdgif_110">3.md插入gif</a>   <a href="#_118">结语</a>   

<hr>

首先你要知道,markdown语法其实是兼容html语法的,这也是为什么我们可以很方便地把markdown转换为html,放置到博客网站上

所以我们可以用html代码来插入视频和mp3音乐

1.md插入视频

对应语法如下,这两个都可以

<video src="视频链接"></video>
<iframe height=498 width=510 src="视频链接">

如果我们插入一个B站视频的链接,在typora中的显示如下 image-20220501214058712

实际上它就是把一个网站插入到了我们的markdown文件中,形成了一个简易的浏览器

其实你如果复制一个视频,直接在typora里面粘贴的话,typora是会自动生成对应的html链接的

<video src="../../../../Desktop/md.mp4"></video>

但这个链接和一个本地的图片链接相同,如果需要上传到CSDN网站上的话,CSDN无法正常转存你的视频

我们要做的,就是把这个视频也上传到我们的图床里面

如果你不知道什么是图床,那就看看我吧:<a href="https://blog.csdn.net/muxuen/article/details/122441469">【图床搭建教程】</a>

图床并不是只能保存图片,它可以保存任何格式的文件。将视频拖入picgo,即可上传我们的视频到图床 image-20220501231545005

点击箭头所指按钮,复制我们视频的链接 image-20220501231749823

然后把视频链接填入上面两种形式其中之一的html代码中,即可显示出视频! image-20220501234129496

1.2CSDN博客插入视频

然后我就发现CSDN不支持上面两种样式,不过我们可以在markdown编辑器的顶部选择视频 image-20220501233931338

然后这里会让你填写视频的地址,目前只支持tx优酷还有bilibili的已上传视频

或者你可以选择“插入已有视频”,这会把视频上传到CSDN上

image-20220501233957991

2.md插入MP3文件

2.1网易云音乐外链

插入MP3文件的方式很简单,我们可以使用网易云音乐,选择一个非VIP歌曲,点击生成外链播放器 image-20220501232318491

然后复制这里的html代码即可! image-20220501232239659

<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=86 src="//music.163.com/outchain/player?type=2&amp;id=33367876&amp;auto=1&amp;height=66"></iframe>

下面就生成了一个网易云音乐的外链播放器(CSDN不支持) image-20220501232417618

2.2自己的MP3音频文件

根据上面html插入视频的代码,就可以猜出来音频的代码是啥

把vedio改成audio就可以啦!

<audio src="mp3文件链接地址"></audio>

下面就是一个我上传的MP3音乐文件(很好,CSDN依旧不支持)

在typora中的样式如下👇 image-20220501233258315

3.md插入gif

这个就没有什么特殊的格式了

gif图片也是一个图片,直接用这种标准的markdown插入图片的样式就可以了,CSDN是支持上传动图的

<hr>

结语

这个新文具的博客到这里就结束啦!

希望对你有帮助!😍

<s>虽然我感觉在markdown中插入视频的使用场景不是很多</s>

原文地址:https://blog.csdn.net/muxuen/article/details/124534999?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522168905674116800227431657%2522%252C%2522scm%2522%253A%252220140713.130102334.pc%255Fall.%2522%257D&request_id=168905674116800227431657&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~all~first_rank_ecpm_v1~rank_v31_ecpm-15-124534999-null-null.142^v88^control_2,239^v2^insert_chatgpt&utm_term=markdown

本文章网址:https://www.sjxi.cn/detil/4937b140fd3546e095aa8a7079f461a5

最新评论

当前未登陆哦
登陆后才可评论哦

湘ICP备2021009447号