Hexo中插入图片和音乐的几种方式

网站原文：Hexo中插入图片和音乐的几种方式

本文提供三种在hexo中插入图片的方式和两种插入音乐的方式。

1. 插入图片

1.1 方案一

简介

![图片说明]('url或图片路径')

这是markdown中常用的引用图片的格式，[]中是图片说明，()中写图片路径或者url。
案例

![方案一](https://suncos-01-1254144885.cos.ap-shanghai.myqcloud.com/Hexo/S.png)

方案一

1.2 方案二

简介

<img src='url或图片路径' height=400px'>

img标签定义 HTML 页面中的图像，img可修改的属性有

案例

<img src='https://suncos-01-1254144885.cos.ap-shanghai.myqcloud.com/Hexo/S.png' height=400px >

1.3 方案三

简介

{% asset_img 1.jpg 这是一个新的博客的图片的说明 %}

方案三需要现在hexo配置文件中将post_asset_folder打开，这样hexo新建博客的时候，会生成相同名称的文件夹，将图片放到文件夹中，可以通过其相对位置进行直接引用。

post_asset_folder: true

案例

{% asset_img S.png 方案三 %}

2. 插入音乐

2.1 方案一

简介
利用html中的audio 标签插入音乐。

<audio autoplay>
  <source src=" url 或 文件路径" type="audio/mpeg">
</audio>

audio标签定义声音，比如音乐或其他音频流。

案例

<audio controls>
  <source src="https://suncos-01-1254144885.cos.ap-shanghai.myqcloud.com/%E9%9F%B3%E4%B9%90/Hold%20back%20the%20river.mp3" type="audio/mpeg">
</audio>

优缺点
优点：音乐可以自己选择，不受曲库限制
缺点：对音乐格式有要求，目前audio 元素支持的3种文件格式：MP3、Wav、Ogg

2.2 方案二

简介
利用网易云音乐生成外链播放器后分享。
现在网易云音乐官网找到自己想要的音乐，

点击音乐下方的“生成外链播放器”，然后进入外链生成界面，复制最下方的HTML代码，拷贝到自己想放的地方即可。这里边框的大小可以自由调节。

案例

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

优点：网易云直接播放，不用自己存储调用
缺点：很多音乐有版权保护，无法生成外链