一、基础内容
1.1 图片
1.2 段落缩进
Dream主题
<p class="indent">Dream主题</p>
1.3 加粗
使用 Dream主题 渲染博客。
1.4 斜体
使用 Dream主题 渲染博客。
1.5 下划线
使用 Dream主题 渲染博客。
1.6 中划线
使用 Dream主题 渲染博客。
1.7 链接
使用 Dream主题 渲染博客。
1.8 文字潜藏
猜猜这是什么:Dream主题
猜猜这是什么:<span class="elude">Dream主题</span>
二、内容块
2.1 引用
使用
Dream主题渲染博客。使用
Dream主题渲染博客。
使用Dream主题渲染博客。
2.2 有序列表
- 使用 Dream主题 渲染博客。
- 使用 Dream主题 渲染博客。
- 使用 Dream主题 渲染博客。
2.3 无序列表
- 使用 Dream主题 渲染博客。
- 使用 Dream主题 渲染博客。
- 使用 Dream主题 渲染博客。
2.4 任务列表
- 使用 Dream主题 渲染博客。
- 使用 Dream主题 渲染博客。
2.5 表格
列1 | 列2 | 列3 |
---|---|---|
内容 | 内容 | 内容 |
内容 | 内容 | 内容 |
内容 | 内容 | 内容 |
2.6 行内代码
使用 Dream主题
渲染博客。
2.7 代码块
/**
* 运行程序
*/
java -jar dream.jar
/**
* 运行程序
*/
java -jar dream.jar
2.8 数学公式
$\sqrt{3x-1}+(1+x)^2$
2.9 mermaid 图表
graph TD;
A-->B;
A-->C;
B-->D;
E-->F;
三、自定义标签
3.1 副标题
<mew-subtitle>这是副标题</subtitle>
3.2 音频播放器
mew-music
标签支持网易云单曲、网易云歌单和音乐链接三种方式播放音乐。
网易云单曲:
<mew-music song="29572089"></mew-music>
特有参数 | 说明 |
---|---|
song | (必选)填写网易云音乐id |
网易云歌单:
<mew-music playlist="7355014621"></mew-music>
特有参数 | 默认值 | 说明 |
---|---|---|
playlist | (必选)填写网易云音乐歌单id | |
order | list | 音频循环顺序,可选值:list ( 列表循环),random (随机) |
fold | false | 列表默认折叠,可选值:false/true |
自定义单曲:
<mew-music url="http://music.163.com/song/media/outer/url?id=29572089.mp3" name="眉间雪"></mew-music>
特有参数 | 默认值 | 说明 |
---|---|---|
url | (必选)音频资源链接 | |
name | 音乐 | 音频名称 |
artist | 未知歌手 | 音频艺术家 |
cover | 音频封面 | |
lrc | 音频歌词LRC文件链接 |
以上为三种音频资源的配置方法,除此以外还包含一些公共的参数:
公共参数 | 默认值 | 说明 |
---|---|---|
theme | Dream 主题色 | 播放器的主题色 |
loop | all | 音频循环播放,可选值:all (循环全部),one (单曲循环),none (不循环) |
autoplay | false | 音频自动播放,可能有些浏览器不支持 |
3.3 bilibili视频
<mew-bilibili bvid="BV1t3411e7x9"></mew-bilibili>
参数 | 默认值 | 说明 |
---|---|---|
bvid | 无 | (必选)视频的bvid |
width | 100% | 视频模块宽度 |
height | 500px | 视频模块高度 |
3.4 标签页
<mew-tabs>
<mew-tab-page title="html">
html内容
</mew-tab-page>
<mew-tab-page title="java">
java内容
</mew-tab-page>
</mew-tabs>
参数 | 默认值 | 说明 |
---|---|---|
title | 默认标签 | 标签页的名称 |
active | 默认选中第一页 | 默认被选中的标签页,可选值:true/false |
3.5 网盘链接
<mew-cloud type="default" url=""></mew-cloud>
<mew-cloud type="360" url="" password="82kD">从360安全云盘分享文件</mew-cloud>
<mew-cloud type="bd" url="" password="gGs2"></mew-cloud>
<mew-cloud type="wy" url=""></mew-cloud>
<mew-cloud type="ali" url=""></mew-cloud>
<mew-cloud type="github" url=""></mew-cloud>
<mew-cloud type="gitee" url=""></mew-cloud>
参数 | 默认值 | 说明 |
---|---|---|
type | default | 网盘类型:default 网络来源,360 360云盘,bd 百度网盘,wy 微云,ali 阿里云盘,github Github仓库,gitee Gitee仓库 |
url | 无 | 下载链接 |
password | 无 | 网盘文件下载提取码 |
3.6 进度条
<mew-progress value="80%" color="#5bb854"></mew-progress>
参数 | 默认值 | 说明 |
---|---|---|
value | 50% | 进度,最高为100% |
color | var(–theme) | 进度条颜色 |
3.7 面板
<mew-panel title="面板标题">
面板内容
</mew-panel>
参数 | 默认值 | 说明 |
---|---|---|
title | 无 | 面板标题 |
color | var(–theme) | 面板颜色 |
2.8 消息
<mew-message type="error">这是一条消息</mew-message>
<mew-message type="success">这是一条消息</mew-message>
<mew-message type="warning">这是一条消息</mew-message>
<mew-message type="info">这是一条消息</mew-message>
2.9 信封分割线
<mew-hr></mew-hr>
参数 | 默认值 | 说明 |
---|---|---|
startColor | #01d0ff | 分割线开始第一个块的颜色 |
endColor | #fc3e85 | 分割线第二个块的颜色 |