样式汇总 | 千灵

文本居中的引用

此标签将生成一个带上下分割线的引用，同时引用内文本将自动居中。文本居中时，多行文本若长度不等，视觉上会显得不对称，因此建议在引用单行文本的场景下使用。例如作为文章开篇引用或者结束语之前的总结引用。
使用方式：

HTML方式：使用这种方式时，给 img 添加属性 class=”blockquote-center” 即可。
标签方式：使用 centerquote 或者简写 cq。

<!-- HTML方式: 直接在 Markdown 文件中编写 HTML 来调用 -->
<!-- 其中 class="blockquote-center" 是必须的 -->
<blockquote class="blockquote-center">blah blah blah</blockquote>

<!-- 标签 方式，要求版本在0.4.5或以上 -->
{% centerquote %}blah blah blah{% endcenterquote %}

<!-- 标签别名 -->
{% cq %} blah blah blah {% endcq %}

人的一切痛苦，本质上都是对自己的无能的愤怒
王小波

超链接

1
2
3

<section class="link-braces">
<p>可后来有二天在医院里，托马斯正在<a href="#">手术间休息</a>，护士告诉他有电话。他断到话筒里<a href="#">传来特丽莎</a>的声音。电话是从车站打来的。他格外高兴，不幸的是他那天夜里有事，要到第二天才能请她上他家去。<a href="#">放下电话</a>，他便责备自己没有叫她直接去他家，他毕竟有足够的时间来取消自已原来的计划！</p>
</section>

可后来有二天在医院里，托马斯正在手术间休息，护士告诉他有电话。他断到话筒里传来特丽莎的声音。电话是从车站打来的。他格外高兴，不幸的是他那天夜里有事，要到第二天才能请她上他家去。放下电话，他便责备自己没有叫她直接去他家，他毕竟有足够的时间来取消自已原来的计划！

Note tag

使用方式：

1	{% note class_name %} Content (md partial supported) {% endnote %}

其中，class_name 可以是以下列表中的一个值：

default
primary
success
info
warning
danger

\themes\next\_config.yml 内可修改参数

default

primary

success

info

warning

danger

Any content (support inline tags too).

{% tabs Unique name, [index] %}
<!-- tab [Tab caption] [@icon] -->
Any content (support inline tags too).
<!-- endtab -->
<!-- tab [Tab caption] [@icon] -->
Any content (support inline tags too).
<!-- endtab -->
{% endtabs %}

链接框

这是一个链接<a id="a1" href="http://www.qianling.pw">这是一个链接</a>

TOC数字块

1.1.

警告

本文旨在介绍样式的使用规则。

1	<div class="alert alert-success"><i class="fa fa-lightbulb-o"></i> 本文旨在介绍样式的使用规则。</div>

本文旨在介绍样式的使用规则。

1	<div class="alert alert-info"><i class="fa fa-info"></i> 本文旨在介绍样式的使用规则。</div>

本文旨在介绍样式的使用规则。

1	<div class="alert alert-warning"><i class="fa fa-info"></i> 本文旨在介绍样式的使用规则。</div>

本文旨在介绍样式的使用规则。

1	<div class="alert alert-danger"><i class="fa fa-bug"></i> 本文旨在介绍样式的使用规则。</div>

文字增加背景色块

站点配置文件站点配置文件
主题配置文件主题配置文件
站点配置文件站点配置文件
主题配置文件主题配置文件

引用边框变色

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-left-red">且不问结果如何，尽自己之所能，积极的面对。</p>

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-left-yellow">且不问结果如何，尽自己之所能，积极的面对。</p>

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-left-green">且不问结果如何，尽自己之所能，积极的面对。</p>

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-left-blue">且不问结果如何，尽自己之所能，积极的面对。</p>

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-left-purple">且不问结果如何，尽自己之所能，积极的面对。</p>

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-right-red">且不问结果如何，尽自己之所能，积极的面对。</p>

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-right-yellow">且不问结果如何，尽自己之所能，积极的面对。</p>

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-right-green">且不问结果如何，尽自己之所能，积极的面对。</p>

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-right-blue">且不问结果如何，尽自己之所能，积极的面对。</p>

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-right-purple">且不问结果如何，尽自己之所能，积极的面对。</p>

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-top-red">且不问结果如何，尽自己之所能，积极的面对。</p>

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-top-yellow">且不问结果如何，尽自己之所能，积极的面对。</p>

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-top-green">且不问结果如何，尽自己之所能，积极的面对。</p>

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-top-blue">且不问结果如何，尽自己之所能，积极的面对。</p>

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-top-purple">且不问结果如何，尽自己之所能，积极的面对。</p>

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-bottom-red">且不问结果如何，尽自己之所能，积极的面对。</p>

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-bottom-yellow">且不问结果如何，尽自己之所能，积极的面对。</p>

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-bottom-green">且不问结果如何，尽自己之所能，积极的面对。</p>

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-bottom-blue">且不问结果如何，尽自己之所能，积极的面对。</p>

且不问结果如何，尽自己之所能，积极的面对。

1	<p id="div-border-bottom-purple">且不问结果如何，尽自己之所能，积极的面对。</p>

在文档中增加图标









Download Now
<a id="download" href="https://git-scm.com/download/win"> Download Now </a>

YouTube

<a id="tube" href="https://www.youtube.com/watch?v=Gl23T9aOfoE"> YouTube 

emoji

😙🍋🎱✊
https://www.emojicopy.com/