目录
使用Markdown在博客中添加视频
使用Markdown在博客中添加视频
不论你是用的是什么博客系统，WP也好，Typecho也罢，甚至是静态博客，就像我的博客，绕不开的是两种书写语言，一种称之为富文本，一种叫做Markdown。我的博客就是用Markdown写的。
Markdown有很多好处，也有很多坏处，比如说居中，Markdown本身没有这个功能。再比如说视频，Markdown也不具有插入视频的功能。
值得庆幸的是Markdown支持HTML的标签，在HTML中我们可以用<video>标签插入视频，在Markdown中，我们同样可以使用<video>标签插入视频，具体格式如下：
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
</video>
或者
<video src="movie.mp4.mp4" controls="controls" width="500" height="300"></video>
当然，除了.mp4它还支持其他的格式，但是对于不同的浏览器支持的格式不一样，见下表：
| 格式 | IE | Firefox | Opera | Chrome | Safari |
|---|---|---|---|---|---|
| Ogg | No | 3.5+ | 10.5+ | 5.0+ | No |
| MPEG4 | 9.0+ | No | No | 5.0+ | 3.0+ |
| WebM | No | 4.0+ | 10.6+ | 6.0+ | No |
当然还有编码等限制，感兴趣的小伙伴可以去Google一下。
video 元素允许多个 source 元素。source 元素可以链接不同的视频文件。浏览器将使用第一个可识别的格式，这样我们只要多准备几个不同格式的视频就可以了。
用法：
1. <video width="500" height="250" controls="controls">
2. <source src="movie.ogg" type="video/ogg">
3. <source src="movie.mp4" type="video/mp4">
4. 您的浏览器不支持此种视频格式。
5. </video>
其次，这是对一些参数的说明：
autoplay :出现该属性意味着视频在就绪后将自动播放，用法：autoplay="autoplay"
controls :出现该属性意味着向用户显示控件，如播放按钮等，用法：controls="controls"
height:设置高度 width:设置宽度
loop:自动重播，用法：loop="loop"
preload:视频在页面加载时进行加载并预备播放，用法：preload="auto" - 当页面加载后载入整个视频；preload="meta" - 当页面加载后只载入元数据；preload="none" - 当页面加载后不载入视频。注意：若使用了autoplay，则忽略preload
src:要播放视频的url
示例：
第一种：
<video width="720" height="303" controls> #或者：<video width:60% height:auto controls>
<source src="https://xxxxxx.mp4" type="video/mp4">
</video>
第二种：
<video src="https://xxxxx.mkv" controls="controls" width:100% height:auto></video>
评论