| Step.4 主题特殊功能 | 您所在的位置：网站首页 › 怀远qzzn › Step.4 主题特殊功能 |
|
🚀快速开始 - 💌依赖插件 - 📌基本配置 - 🌈界面显示 - 🦄特殊功能 以下介绍可以使用的 markdown 或者标签代码。功能大部分基于 hexo-renderer-multi-markdown-it 渲染器，尤其是代码块的显示，与默认渲染器不兼容。 # links 链接块本功能参考 NexT，基于 Hexo Tag 功能，用来建立友链或其他网址链接功能。 文章中的使用格式： 使用 links 标签块，包围 yml 语法书写的内容，字段包括site站点名称必填owner管理员名字可选，默认为 site 的值url站点链接必填desc站点描述可选，默认为 url 的值image站点图片可选，默认为 images/404.pngcolor方块颜色可选，默认为 #666{% links %}- site: #站点名称 owner: #管理员名字 url: #站点网址 desc: #简短描述 image: #一张图片 color: #颜色代码{% endlinks %}举个栗子： {% links %}- site: 優萌初華 owner: 霜月琉璃 url: https://shoka.lostyu.me desc: 琉璃的医学 & 编程笔记 image: https://cdn.jsdelivr.net/gh/amehime/shoka@latest/images/avatar.jpg color: "#e9546b"- site: 優萌初華 owner: 霜月琉璃 url: https://shoka.lostyu.me image: images/avatar.jpg- site: 優萌初華 url: https://shoka.lostyu.me desc: 琉璃的医学 & 编程笔记 color: "#9d5b8b"{% endlinks %}優萌初華琉璃的医学 & 编程笔记 優萌初華https://shoka.lostyu.me 優萌初華琉璃的医学 & 编程笔记 以上标签块里的内容，还可以保存到一个 yml 文件中，然后使用 linksfile 标签。其中， path 位于 /source 目录下。{% linksfile [path] %}举个栗子： {% linksfile friends/_data.yml %}# code 代码块使用 markdown-it-prism 进行代码高亮，支持显示行号、行高亮 mark 、命令行提示符 command 、代码块标题。 基本格式： [language] [title] [url] [link text] [mark] [command] 选项描述默认值language 支持的语言戳此如果不需要代码高亮，但希望显示代码块样式，则设为 raw留空或设为 info ，将不显示代码高亮和代码块样式null title代码块的标题文字nullurl代码块标题右侧显示的链接nulllink text上述链接显示的标题linkmark 行高亮显示，格式为 mark:行号,行号开始-行号结束,其他行号 。例如 mark:1,4-7,10 ，将高亮显示第 1、4、5、6、7、10 行 null command 命令行提示符，格式为 command:("提示内容":行号,行号||"提示内容":行号开始-行号结束)例如 command:("[root@localhost] $":1,9-10||"[admin@remotehost] #":4-6) null ```java 行高亮 https://shoka.lostyu.me 参考链接 mark:1,6-7import java.util.Scanner;...Scanner in = new Scanner (System.in);// 输入 Scan 之后，按下键盘 Alt + “/” 键，Eclipse 下自动补全。System.out.println (in.nextLine ());System.out.println ("Hello" + "world.");``````bash 命令行提示符 command:("[root@localhost] $":1,9-10||"[admin@remotehost] #":4-6)pwd/usr/home/chris/binls -latotal 2drwxr-xr-x 2 chris chris 11 Jan 10 16:48 .drwxr--r-x 45 chris chris 92 Feb 14 11:10 ..-rwxr-xr-x 1 chris chris 444 Aug 25 2013 backup-rwxr-xr-x 1 chris chris 642 Jan 17 14:42 deploygit add -Agit commit -m "update"git push```行高亮参考链接import java.util.Scanner;...Scanner in = new Scanner(System.in);// 输入 Scan 之后，按下键盘 Alt + “/” 键，Eclipse 下自动补全。System.out.println(in.nextLine());System.out.println("Hello" + " world.");命令行提示符pwd/usr/home/chris/binls -latotal 2drwxr-xr-x 2 chris chris 11 Jan 10 16:48 .drwxr--r-x 45 chris chris 92 Feb 14 11:10 ..-rwxr-xr-x 1 chris chris 444 Aug 25 2013 backup-rwxr-xr-x 1 chris chris 642 Jan 17 14:42 deploygit add -Agit commit -m "update"git push# quiz 练习题与答案这个功能是用来显示练习题的。需要在 Front Matter 中添加 quiz: true ，以正确显示题型标签。 几个例子---title: 练习题与答案quiz: true---1. 编译时多态主要指运算符重载与函数重载，而运行时多态主要指虚函数。 {.quiz .true}2. 有基类 `SHAPE`，派生类 `CIRCLE`，声明如下变量： {.quiz .multi} ```cpp SHAPE shape1,*p1; CIRCLE circle1,*q1; ``` 下列哪些项是 “派生类对象替换基类对象”。 - `p1=&circle1;` {.correct} - `q1=&shape1;` - `shape1=circle1;` {.correct} - `circle1=shape1;`{.options} > - :heavy_check_mark: 令基类对象的指针指向派生类对象 > - :x: 派生类指针指向基类的引用 > - :heavy_check_mark: 派生类对象给基类对象赋值 > - :x: 基类对象给派生类对象赋值 > {.options}3. 下列叙述正确的是 []{.gap} 。 {.quiz} - 虚函数只能定义成无参函数 - 虚函数不能有返回值 - 能定义虚构造函数 - A、B、C 都不对 {.correct}{.options}10. 如果定义 `int e=8; double f=6.4, g=8.9;`，则表达式 `f+int (e/3*int (f+g)/2)%4` 的值为 [9.4]{.gap}。 {.quiz .fill} > 注意运算顺序和数据类型 > [8.4]{.mistake}点击选项可以显示答案，以及答案解析。 下列叙述正确的是 。 虚函数只能定义成无参函数虚函数不能有返回值能定义虚构造函数A、B、C 都不对有基类 SHAPE ，派生类 CIRCLE ，声明如下变量： SHAPE shape1,*p1;CIRCLE circle1,*q1;下列哪些项是 “派生类对象替换基类对象”。 p1=&circle1;q1=&shape1;shape1=circle1;circle1=shape1;✔️ 令基类对象的指针指向派生类对象❌ 派生类指针指向基类的引用✔️ 派生类对象给基类对象赋值❌ 基类对象给派生类对象赋值编译时多态主要指运算符重载与函数重载，而运行时多态主要指虚函数。 如果定义 int e=8; double f=6.4, g=8.9; ，则表达式 f+int(e/3*int(f+g)/2)%4 的值为 9.4。 注意运算顺序和数据类型8.4 # 使用说明本功能基于 markdown-it-bracketed-spans 和 markdown-it-attrs 标签含义{.quiz}选择题{.quiz .multi}多选题{.quiz .true}正确的判断题{.quiz .false}错误的判断题{.quiz .fill}填空题[]{.gap}空白下划线[答案内容]{.gap}答案内容带下划线{.options}ABCDE 选项{.correct}选择题的正确选项>答案解析[8.4]{.mistake}错题备注# emoji 绘文字本功能基于 markdown-it-emoji ，所有标签参考戳此 :kissing_heart::ring::notes:😘 💍 🎶 # effects 文字特效本功能基于 markdown-it-ins 、 markdown-it-bracketed-spans 和 markdown-it-attrs 本主题风格颜色通用样式：default、primary、success、info、warning、danger ++ 下划线 ++++ 波浪线 ++{.wavy}++ 着重点 ++{.dot}++ 紫色下划线 ++{.primary}++ 绿色波浪线 ++{.wavy .success}++ 黄色着重点 ++{.dot .warning}~~ 删除线～～~~ 红色删除线～～{.danger}== 荧光高亮 ==[赤橙黄绿青蓝紫]{.rainbow}[红色]{.red}[粉色]{.pink}[橙色]{.orange}[红色]{.yellow}[绿色]{.green}[靛青]{.aqua}[蓝色]{.blue}[紫色]{.purple}[灰色]{.grey}快捷键 [Ctrl]{.kbd} + [C]{.kbd .red}H~2~029^th^这段代码因为自动被 pangu.js 处理了一下，加了几个空格，导致直接复制代码不能正常显示。正确的代码是 ++下划线++ ~~删除线~~ ==荧光高亮== ，不能有空格哦。 下划线波浪线着重点紫色下划线绿色波浪线黄色着重点删除线红色删除线荧光高亮赤橙黄绿青蓝紫红色粉色橙色黄色绿色靛青蓝色紫色灰色快捷键 Ctrl + CH2029th # spoiler 隐藏文字本功能基于 markdown-it-spoiler 和 markdown-it-attrs !! 黑幕黑幕黑幕黑幕黑幕黑幕！！： 鼠标滑过显示内容!! 模糊模糊模糊模糊模糊模糊！！{.bulr} ： 选中文字显示内容黑幕黑幕黑幕黑幕黑幕黑幕 ： 鼠标滑过显示内容模糊模糊模糊模糊模糊模糊 ： 选中文字显示内容 # label 标签块本功能基于 markdown-it-bracketed-spans 和 markdown-it-attrs有以下颜色可选 [default]{.label}[primary]{.label .primary}[info]{.label .info}[:heavy_check_mark:success]{.label .success}[warning]{.label .warning}[:broken_heart:danger]{.label .danger}defaultprimaryinfo✔️successwarning💔danger # note 提醒块本功能基于 markdown-it-container标签为： 开始行:::[风格颜色]结束行::::::default默认默认::::::primary基本基本::::::info提示提示::::::success成功成功::::::warning警告警告::::::danger危险危险::::::danger no-icon危险危险:::默认默认 基本基本 提示提示 成功成功 警告警告 危险危险 没有图标 # tab 标签卡本功能基于 markdown-it-container标签为： 开始行;;;[同一ID] [标签名称]结束行;;;;;;id1 卡片 1这里是卡片 1 的内容** 加粗 **[success]{.label .success}{% links %}- site: 優萌初華 owner: 霜月琉璃 url: https://shoka.lostyu.me desc: 琉璃的医学 & 编程笔记 image: https://cdn.jsdelivr.net/gh/amehime/shoka@latest/images/avatar.jpg color: "#e9546b"{% endlinks %};;;;;;id1 卡片 2这里是卡片 2 的内容:::danger危险危险:::- 第一行- 第二行;;;;;;id2 ②号标签卡片 1这里是卡片 1 的内容;;;;;;id2 ②号标签卡片 2这里是卡片 2 的内容;;;这里是卡片 1 的内容加粗success 優萌初華琉璃的医学 & 编程笔记 这里是卡片 2 的内容 危险危险 第一行第二行这里是卡片 1 的内容 这里是卡片 2 的内容 # collapse 折叠块本功能基于 markdown-it-container标签为： 开始行+++[风格颜色] [标题文字]结束行++++++ 默认默认 这里是一段文字++ 下划线 ++++++++primary 紫色:::info参考信息:::- 第一行- 第二行++++++info 蓝色;;;id3 卡片 1这里是卡片 1 的内容;;;;;;id3 卡片 2这里是卡片 2 的内容;;;++++++success 绿色{% links %}- site: 優萌初華 url: https://shoka.lostyu.me color: "#e9546b"{% endlinks %}++++++warning 黄色!! 警告警告警告警告警告！！{.bulr}[label]{.label .success}++++++danger 红色[danger]{.label .danger}+++默认默认 这里是一段文字下划线 紫色参考信息 第一行第二行蓝色这里是卡片 1 的内容波浪线 这里是卡片 2 的内容 绿色優萌初華https://shoka.lostyu.me 黄色警告警告警告警告警告label 红色danger # taskList 待办事项本功能基于 markdown-it-task-checkbox 。可以利用 markdown-it-attrs 添加风格颜色，只可以给 ul 标签添加，需要新建两行。 - [ ] 这是一个小叉叉- [x] 这是一个红色勾勾{.danger}- [ ] 未完成- [x] 完成{.primary}- [ ] 未完成- [x] 默认颜色# furigana 文字注音原本用于日语汉字假名注音，但别的注音也可以。为了兼容性，采用 markdown-it-ruby 的基本格式： {文字^注音} ，并且为了兼容表格，将分隔符由 | 换成了 ^ 。注音分隔基于 furigana-markdown-it 显示说明看这里 {取り返す^とりかえす}取(と) り返(かえ) す{可愛い犬^か+わい・い・いぬ}可愛(かわい) い犬(いぬ){可愛い犬^か・わい・いいぬ}可(か) 愛(わい) い犬(いぬ){アクセラレータ^accelerator}アクセラレータ(accelerator){accelerator^アクセラレータ}accelerator(アクセラレータ){食べる^たべる}食(た) べる{食べる^=たべる}食べる(たべる){あいうえお^*}あ●い●う●え●お●{あいうえお^*❤}あ❤い❤う❤え❤お❤{常用账号^contact}常用账号(contact)# media 多媒体本功能基于 Hexo Tag 功能，使用 media 标签，目前可选择两种类型，即 audio 和 video 。 {% media audio %}... 音频列表{% endmedia %}{% media video %}... 视频列表{% endmedia %}标签包绕一段 yml 格式的内容，格式与背景音乐的配置类似。 亦可以直接使用网易云、虾米、QQ 音乐的播放列表、单曲。 举个栗子{% media audio %}- title: 列表 1 list: - https://music.163.com/#/playlist?id=2943811283 - https://music.163.com/#/playlist?id=2297706586- title: 列表 2 list: - https://music.163.com/#/playlist?id=2031842656{% endmedia %}{% media video %}- name: "测试 1" url: https://cdn.kastatic.org/ka-youtube-converted/O_nY1TM2RZM.mp4/O_nY1TM2RZM.mp4#t=0- name: "测试 2" url: https://cdn.kastatic.org/ka-youtube-converted/O_nY1TM2RZM.mp4/O_nY1TM2RZM.mp4#t=0{% endmedia %}# math 数学公式本功能基于 markdown-it-katex在 Front Matter 中添加 math: true 以支持 KaTex ---title: 数学公式显示math: true---行内公式：$\sqrt {3x-1}+(1+x)^2$独立块显示：$$\begin {array}{c}\nabla \times \vec {\mathbf {B}} -\, \frac1c\, \frac {\partial\vec {\mathbf {E}}}{\partial t} &= \frac {4\pi}{c}\vec {\mathbf {j}} \nabla \cdot \vec {\mathbf {E}} & = 4 \pi \rho \\\nabla \times \vec {\mathbf {E}}\, +\, \frac1c\, \frac {\partial\vec {\mathbf {B}}}{\partial t} & = \vec {\mathbf {0}} \\\nabla \cdot \vec {\mathbf {B}} & = 0\end {array}$$行内公式：3x−1+(1+x)2\sqrt{3x-1}+(1+x)^23x−1+(1+x)2 独立块显示： ∇×B⃗−1c∂E⃗∂t=4πcj⃗∇⋅E⃗=4πρ∇×E⃗+1c∂B⃗∂t=0⃗∇⋅B⃗=0\begin{array}{c} \nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} & = \frac{4\pi}{c}\vec{\mathbf{j}} \nabla \cdot \vec{\mathbf{E}} & = 4 \pi \rho \\ \nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} & = \vec{\mathbf{0}} \\ \nabla \cdot \vec{\mathbf{B}} & = 0 \end{array}∇×B−c1∂t∂E∇×E+c1∂t∂B∇⋅B=c4πj∇⋅E=0=0=4πρ # mermaid 流程图本功能基于 markdown-it-mermaid在 Front Matter 中添加 mermaid: true 以支持 Mermaid ---title: 流程图显示mermaid: true---```mermaidgraph LR A [Square Rect] -- Link text --> B ((Circle)) A --> C (Round Rect) B --> D {Rhombus} C --> D``````mermaidsequenceDiagram loop Daily query Alice->>Bob: Hello Bob, how are you? alt is sick Bob->>Alice: Not so good :( else is well Bob->>Alice: Feeling fresh like a daisy end opt Extra response Bob->>Alice: Thanks for asking end end```Link textSquare RectCircleRound RectRhombusAliceBobHello Bob, how are you?Not so good :(Feeling fresh like a daisyalt[is sick][is well]Thanks for askingopt[Extra response]loop[Daily query]AliceBob Hexo Shoka 教程 |
| 今日新闻 |
| 推荐新闻 |
| 专题文章 |
| CopyRight 2018-2019 实验室设备网 版权所有 |