markdown插入圖片、音訊影片

xiezhr發表於2023-05-07
音訊

1、markdown 簡介

  • Markdown 是一種輕量級標記語言，它允許人們使用易讀易寫的純文字格式編寫文件。

  • Markdown 編寫的文件字尾為 .md, .markdown

  • 簡單易學容易上手，十分鐘左右即可上手

  • 有助於作者專心寫作（各種線上部落格編輯坑太多，文件丟失、廣告太多，可移植性差）

2、插入圖片

我們在寫部落格的時候總免不了要插入各種圖片，下面就是markdown插入圖片的語法

![這裡填寫圖片的描述資訊](這裡填寫圖片的路徑，相對或決定路徑都可以)

插入圖片列子：

插入圖片例子

我們經常需要將一篇費勁心思寫好的文章釋出到各大平臺<微信公眾號、頭條、掘金、今日頭條。。。以上插入圖片語法雖然簡單，但是圖片存放就成了一個問題。 圖片存在本地的話，上傳到各個網站就沒法顯示了，就算一個一個複製貼上上去，移植到其他平臺，如果平臺沒有自動儲存圖片功能，圖片就會消失。這時候我們就需要一個圖床。

什麼是圖床呢？

  • 圖床就是一個便於在部落格中插入線上圖片的個人圖片倉庫。設定圖床之後，我們可以隨時將我們用到的圖片上傳到倉庫，方便在博文中使用，預覽。並且只要不親自刪除，就可以隨時隨地預覽

下面介紹一個 PicGo + Gitee(碼雲)實現markdown圖床 免費

PicGo + Gitee(碼雲)實現免費markdown圖床

3、插入音訊

3.1 使用audio 標籤

語法

<audio id="audio" controls="" preload="none">
      <source id="mp3" src="音訊地址">
</audio>

3.2 使用iframe標籤

下面我們以獲取網易雲音樂為例

  1. 首先在網易雲音樂播放介面，點選生成外鏈播放器

image-20201118231021010

  1. 選擇自己想要的大小的iframe程式碼塊

image-20201118231344091

  1. 複製iframe程式碼塊

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

加好之後效果如下

4、引入影片

我們小破站為例

1.找到我們想插入的影片，然後點選下面的分享

image-20201118231928427

  1. 加入一個自適應iframe

    <iframe src="//player.bilibili.com/player.html?aid=59317437&bvid=BV1Pt411G7qh&cid=103365806&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

加好之後如下

g="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> 


加好之後如下

<iframe src="//player.bilibili.com/player.html?aid=59317437&bvid=BV1Pt411G7qh&cid=103365806&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

相關文章