你好,Hexo主题Butterfly!
访问链接
Markdown 链接
HTML标签:超链接
<a> 标签的 target 属性规定在何处打开链接文档
- _blank:新建标签页打开,
target="_blank" - _self:在当前标签页打开,
target="_self"
<a> 标签的 download 属性规定被下载的超链接目标
- 只有 Firefox 和 Chrome 支持 download 属性
- 在
<a>标签中必须设置 href 属性 - 可以设置
download属性的值来规定下载文件的名称,浏览器将自动检测文件扩展名并添加到文件
访问文章
绝对路径访问文章
相对根路径访问文章
相对当前路径访问文章
md文件被渲染的实际页面
hello-butterfly.md -> hello-butterfly/index.html
引用网络图片
Markdown 图片
![]()
![]()
HTML标签:图像
<img> 标签的 alt 属性规定图像的替代文本<img> 标签的 height 属性规定图像的高度<img> 标签的 width 属性规定图像的宽度<img> 标签的 loading 属性指定浏览器是应立即加载图像还是延迟加载图像
- eager:立即加载,
loading="eager" - lazy:延迟加载,
loading="lazy"
引用本地图片
引用本地资源
将 config.yml 文件中的 post_asset_folder 选项设为 true 来打开。
当资源文件管理功能打开后,Hexo将会在你每一次通过hexo new [layout] <title>命令创建新文章时自动创建一个文件夹。
这个资源文件夹将会有与这个文章文件一样的名字。
将所有与你的文章有关的资源放在这个关联文件夹中之后,你可以通过相对路径来引用它们,这样你就得到了一个更简单而且方便得多的工作流。
绝对路径引用本地图片
相对根路径引用本地图片
![]()
![]()
![]()
相对当前路径引用本地图片
md文件被渲染的实际页面
hello-butterfly.md -> hello-butterfly/index.html
- 本博文图片
![]()
- 同级博文图片
![]()
访问网络音频
HTML标签:音频
使用 HTML5 <audio> 元素
<audio> 标签的 autoplay 属性,如果出现该属性,则音频在就绪后马上播放。<audio autoplay><audio> 标签的 controls 属性,如果出现该属性,则向用户显示音频控件(比如播放/暂停按钮)。<audio controls><audio> 标签的 loop 属性,如果出现该属性,则每当音频结束时重新开始播放。<audio loop>
使用超链接
如果网页包含指向媒体文件的超链接,大多数浏览器会使用“辅助应用程序”来播放文件。
网易云音乐iframe插件
单曲的外链播放器
访问本地音频
绝对路径访问本地音频
相对根路径访问本地音频
相对当前路径访问本地音频
播放网络视频
HTML标签:视频
使用 HTML5 <video> 标签
<video>元素支持三种视频格式:MP4、WebM、Ogg。
| 格式 | MIME-type |
|---|---|
| MP4 | video/mp4 |
| WebM | video/webm |
| Ogg | video/ogg |
<video> 标签的 autoplay 属性,如果出现该属性,则视频在就绪后马上播放。<video autoplay><video> 标签的 controls 属性,如果出现该属性,则向用户显示控件,比如播放按钮。<video controls><video> 标签的 loop 属性,如果出现该属性,则当媒介文件完成播放后再次开始播放。<video loop><video> 标签的 muted 属性,如果出现该属性,视频的音频输出为静音。<video muted><video> 标签的 poster 属性规定视频正在下载时显示的图像,直到用户点击播放按钮。<video poster="URL"><video> 标签的 height 属性设置视频播放器的高度。<video> 标签的 width 属性设置视频播放器的宽度。
- 注意: Internet Explorer 8 及更早IE版本不支持
<video>标签。
