[line]Typecho Joe 主题[/line][line]标题演示[/line]一级标题样式实现代码：# 我是一级标题，一个#号二级标题风格样式实现代码：## 我是二级标题，两个#号三级标题风格样式实现代码：### 我是三级标题，三个#号四级标题风格样式实现代码：#### 我是四级标题，四个#号五级标题风格样式实现代码：##### 我是五级标题，四个#号六级标题风格样式实现代码：###### 我是六级标题，六个#号[line]标签短代码[/line][tag type="default"]标签一[/tag] [tag type="success"]标签二[/tag] [tag type="info"]标签三[/tag] [tag type="warning"]标签四[/tag] [tag type="danger"]标签五[/tag]用的时候把 @ 符号删掉[@tag type="default"]标签一[/tag] [@tag type="success"]标签二[/tag] [@tag type="info"]标签三[/tag] [@tag type="warning"]标签四[/tag] [@tag type="danger"]标签五[/tag][line]按钮短代码[/line][btn href="" type="default"]默认按钮[/btn] [btn href="" type="primary"]主要按钮[/btn] [btn href="" type="success"]成功按钮[/btn] [btn href="" type="info"]信息按钮[/btn] [btn href="" type="warning"]警告按钮[/btn] [btn href="" type="danger"]危险按钮[/btn]用的时候把 @ 符号删掉。href: 跳转链接[@btn href="" type="default"]默认按钮[/btn] [@btn href="" type="primary"]主要按钮[/btn] [@btn href="" type="success"]成功按钮[/btn] [@btn href="" type="info"]信息按钮[/btn] [@btn href="" type="warning"]警告按钮[/btn] [@btn href="" type="danger"]危险按钮[/btn][line]提示短代码[/line][alt type="success"]成功提示的文案[/alt] [alt type="info"]消息提示的文案[/alt] [alt type="warning"]警告提示的文案[/alt] [alt type="error"]错误提示的文案[/alt]用的时候把 @ 符号删掉[@alt type="success"]成功提示的文案[/alt] [@alt type="info"]消息提示的文案[/alt] [@alt type="warning"]警告提示的文案[/alt] [@alt type="error"]错误提示的文案[/alt][line]当前线状标题短代码[/line]用的时候把 @ 符号删掉[line]当前线状标题短代码[/line][@line]当前线状标题短代码[/line][line]tab栏短代码[/line][tabs] [tab-pane label="用户管理"]用户管理[/tab-pane] [tab-pane label="配置管理"]配置管理[/tab-pane] [tab-pane label="角色管理"]角色管理[/tab-pane] [tab-pane label="角色管理"]角色管理[/tab-pane] [/tabs][@tabs] [@tab-pane label="用户管理"]用户管理[/tab-pane] [@tab-pane label="配置管理"]配置管理[/tab-pane] [@tab-pane label="角色管理"]角色管理[/tab-pane] [@tab-pane label="角色管理"]角色管理[/tab-pane] [@/tabs][line]基础卡片短代码[/line]用的时候把 @ 符号删掉。 width 不可省略[card-default width="100%" label="卡片标题"]卡片内容[/card-default][@card-default width="100%" label="卡片标题"]卡片内容[/card-default][line]展开关闭短代码[/line]用的时候把 @ 符号删掉[collapse] [collapse-item label="标题"]我是隐藏的[/collapse-item] [collapse-item label="标题"]我是隐藏的[/collapse-item] [/collapse][@collapse] [@collapse-item label="标题"]我是隐藏的[/collapse-item] [@collapse-item label="标题"]我是隐藏的[/collapse-item] [@/collapse][line]时间线短代码[/line]用的时候把 @ 符号删掉[timeline] [timeline-item]啊哈哈哈哈[/timeline-item] [timeline-item]草族看剑[/timeline-item] [/timeline][@timeline] [@timeline-item]啊哈哈哈哈[/timeline-item] [@timeline-item]草族看剑[/timeline-item] [@/timeline][line]复制短代码[/line]用的时候把 @ 符号删掉[copy]点我复制[/copy][@copy]点我复制[@/copy][line]打字机效果短代码[/line]用的时候把 @ 符号删掉。这里可能看不出效果[typing]打字机打字机[/typing][@typing]打字机打字机[@/typing][line]回复可见短代码[/line]用的时候把 @ 符号删掉。[@hide]我是被隐藏的内容[@/hide][line]主题自带消息弹窗[/line]成功提示 警告提示 消息提示注意：以上的提示信息，在移动端的样式是统一的，只会在PC端呈现不同的样式，下面是以上实现的代码成功提示 警告提示 消息提示[line]相册功能[/line][photo] [/photo]用的时候把 @ 符号删掉。[@photo] ![27971701.jpg][5] ![29474172.jpg][6] ![253609676.jpg][7] [@/photo] [line]卡片导航功能[/line][card-nav] [card-nav-item src="http://baidu.com" title="百度一下" img="https://www.baidu.com/img/baidu_85beaf5496f291521eb75ba38eacbd87.svg" /] [card-nav-item src="http://baidu.com" title="百度一下" img="https://www.baidu.com/img/baidu_85beaf5496f291521eb75ba38eacbd87.svg" /] [/card-nav]用的时候把 @ 符号删掉。[@card-nav] [@card-nav-item src="http://baidu.com" title="百度一下" img="https://www.baidu.com/img/baidu_85beaf5496f291521eb75ba38eacbd87.svg" /] [@card-nav-item src="http://baidu.com" title="百度一下" img="https://www.baidu.com/img/baidu_85beaf5496f291521eb75ba38eacbd87.svg" /] [@/card-nav][line]文章插入视频[/line][dplayer src="https://yun.abcio.cn/abcio/video/guzhuang.mp4" /]用的时候把 @ 符号删掉。[@dplayer src="https://yun.abcio.cn/abcio/video/guzhuang.mp4" /][line]网易云音乐[/line][music id="1495496315"/]用的时候把 @ 符号删掉。[@music id="1495496315"/][line]网易云歌单[/line][music-list id="5370364292" /]用的时候把 @ 符号删掉。[@music-list id="5370364292" /]本文转载自Joe博客，原文链接：Joe主题