深林 版式

[!-- {$theme}]

[[module css]]
@import url('https://scp-wiki-cn.wikidot.com/local--code/theme:marchen/1');

/* {$daybreak}/

@import url('https://scp-wiki-cn.wikidot.com/local--code/theme:marchen/2');

/{$daybreak} */

[[/module]]

[!{$theme} --]

[!-- {$pagebook-start}]

[[module css]]

.book.n{$bookNo} > div:nth-of-type(n+3) { display: none; }

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page1, .collapsible-block-unfolded[style="display: block;"] span.page1) > div:nth-of-type(n):nth-of-type(-n+1) {
  display: none;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page1, .collapsible-block-unfolded[style="display: block;"] span.page1) > div:nth-of-type(n+2):nth-of-type(-n+4) {
  display: block;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page1, .collapsible-block-unfolded[style="display: block;"] span.page1) > div:nth-of-type(n+5) {
  display: none;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page2, .collapsible-block-unfolded[style="display: block;"] span.page2) > div:nth-of-type(n):nth-of-type(-n+3) {
  display: none;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page2, .collapsible-block-unfolded[style="display: block;"] span.page2) > div:nth-of-type(n+4):nth-of-type(-n+6) {
  display: block;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page2, .collapsible-block-unfolded[style="display: block;"] span.page2) > div:nth-of-type(n+6) {
  display: none;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page3, .collapsible-block-unfolded[style="display: block;"] span.page3) > div:nth-of-type(n):nth-of-type(-n+5) {
  display: none;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page3, .collapsible-block-unfolded[style="display: block;"] span.page3) > div:nth-of-type(n+6):nth-of-type(-n+8) {
  display: block;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page3, .collapsible-block-unfolded[style="display: block;"] span.page3) > div:nth-of-type(n+8) {
  display: none;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page4, .collapsible-block-unfolded[style="display: block;"] span.page4) > div:nth-of-type(n):nth-of-type(-n+7) {
  display: none;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page4, .collapsible-block-unfolded[style="display: block;"] span.page4) > div:nth-of-type(n+8):nth-of-type(-n+10) {
  display: block;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page4, .collapsible-block-unfolded[style="display: block;"] span.page4) > div:nth-of-type(n+10) {
  display: none;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page5, .collapsible-block-unfolded[style="display: block;"] span.page5) > div:nth-of-type(n):nth-of-type(-n+9) {
  display: none;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page5, .collapsible-block-unfolded[style="display: block;"] span.page5) > div:nth-of-type(n+10):nth-of-type(-n+12) {
  display: block;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page5, .collapsible-block-unfolded[style="display: block;"] span.page5) > div:nth-of-type(n+12) {
  display: none;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page6, .collapsible-block-unfolded[style="display: block;"] span.page6) > div:nth-of-type(n):nth-of-type(-n+11) {
  display: none;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page6, .collapsible-block-unfolded[style="display: block;"] span.page6) > div:nth-of-type(n+12):nth-of-type(-n+14) {
  display: block;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page6, .collapsible-block-unfolded[style="display: block;"] span.page6) > div:nth-of-type(n+14) {
  display: none;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page7, .collapsible-block-unfolded[style="display: block;"] span.page7) > div:nth-of-type(n):nth-of-type(-n+13) {
  display: none;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page7, .collapsible-block-unfolded[style="display: block;"] span.page7) > div:nth-of-type(n+14):nth-of-type(-n+16) {
  display: block;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page7, .collapsible-block-unfolded[style="display: block;"] span.page7) > div:nth-of-type(n+16) {
  display: none;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page8, .collapsible-block-unfolded[style="display: block;"] span.page8) > div:nth-of-type(n):nth-of-type(-n+15) {
  display: none;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page8, .collapsible-block-unfolded[style="display: block;"] span.page8) > div:nth-of-type(n+16):nth-of-type(-n+18) {
  display: block;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page8, .collapsible-block-unfolded[style="display: block;"] span.page8) > div:nth-of-type(n+18) {
  display: none;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page9, .collapsible-block-unfolded[style="display: block;"] span.page9) > div:nth-of-type(n):nth-of-type(-n+17) {
  display: none;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page9, .collapsible-block-unfolded[style="display: block;"] span.page9) > div:nth-of-type(n+18):nth-of-type(-n+20) {
  display: block;
}

.book.n{$bookNo}:has(.collapsible-block-unfolded[style=""] span.page9, .collapsible-block-unfolded[style="display: block;"] span.page9) > div:nth-of-type(n+20) {
  display: none;
}

[[/module]]

[[div class="blockquote wide book n{$bookNo}" style="height: {$height};"]]

[!{$pagebook-start} --]

[!-- {$paging}]

[[div class="paging"]]
[[collapsible show=" " hide=" "]]
[[span class="page{$pageNo}"]]@@ @@[[/span]]
[[/collapsible]]
[[/div]]

[!{$paging} --]

[!-- {$pagebook-end}]

[[/div]]

[!{$pagebook-end} --]

[!-- {$portable-toc}]

[[div class="port-toc"]]
[[collapsible show="◀" hide="◁"]]
[[toc]]
[[/collapsible]]
[[/div]]

[!{$portable-toc} --]

[!-- {$selres-part1}]

[[module css]]

.selres.n{$selectionNo}:has(.collapsible-block-unfolded[style=""] span.branchA.n{$selectionNo}, .collapsible-block-unfolded[style="display: block;"] span.branchA.n{$selectionNo}) > div.a {
  display: block;
}

.selres.n{$selectionNo}:has(.collapsible-block-unfolded[style=""] span.branchB.n{$selectionNo}, .collapsible-block-unfolded[style="display: block;"] span.branchB.n{$selectionNo}) > div.b {
  display: block;
}

[[/module]]

[[div class="selres n{$selectionNo}"]]

[[div class="selection"]]

[[div class="selA"]]

[[div class="sel-display"]]

[!{$selres-part1} --]

[!-- {$selres-part2}]

[[/div]]

[[collapsible show="　" hide="　"]]
[[span class="branchA n{$selectionNo}"]]@@ @@[[/span]]
[[/collapsible]]

[[/div]]

[[div class="selB"]]

[[div class="sel-display"]]

[!{$selres-part2} --]

[!-- {$selres-part3}]

[[/div]]

[[collapsible show="　" hide="　"]]
[[span class="branchB n{$selectionNo}"]]@@ @@[[/span]]
[[/collapsible]]

[[/div]]

[[/div]]

[[div class="result a"]]

[!{$selres-part3} --]

[!-- {$selres-part4}]
[[/div]]

[[div class="result b"]]
[!{$selres-part4} --]

[!-- {$selres-part5}]
[[/div]]

[[/div]]
[!{$selres-part5} --]

[!-- {$has-warning}]
[[div class="error-block has-warning"]]
如果您看到了这段文字，那么您使用的浏览器很可能并不支持本文章的全部展示效果。

如果您希望体验完整的文章内容，请换用电脑端或升级到浏览器的最新版本后再进行阅读。
[[/div]]
[!{$has-warning} --]

[[iftags +版式]]

[[module css]]
@import url('https://scp-wiki-cn.wikidot.com/local--code/theme:marchen/1');

/* {$daybreak}/

@import url('https://scp-wiki-cn.wikidot.com/local--code/theme:marchen/2');

/{$daybreak} */

.movie .scp-image-block .image {
  background-color: white;
}

#page-title {
  display: none;
}

[[/module]]

[[div class="meta-title"]]
Märchen Theme
[[/div]]

[[>]]
[[module rate]]
[[/>]]

[[include :scp-wiki-cn:credit:start]]
页面信息
[[include :scp-wiki-cn:credit:more]]
更多页面信息
[[include :scp-wiki-cn:credit:end]]

[[include :scp-wiki-cn:credit:start-standalone]]

[[include :scp-wiki-cn:credit:end-standalone]]

这是[[*user Sharia Vanilla]]为SCP基金会中文分部制作的美学版式，主要用于[[[waldichter-hub|吟游诗客]]]的GoI格式。该版式基于[[[theme:parallel|平行]]]制作。

在你的作品开头添加如下代码以应用此版式：

[[div class="code"]]
@@[[include :scp-wiki-cn:theme:marchen theme=--]]@@
[[/div]]

或使用如下代码调用亮色背景版本：

[[div class="code"]]
@@[[include :scp-wiki-cn:theme:marchen theme=-- | daybreak=*]]@@
[[/div]]

此外，可以使用如下代码调整页面背景图像：

[[div class="code"]]
@@[[module css]]@@
@@:root {@@
@@  --bg-img: url(https://...);@@
@@}@@
@@[[/module]]@@
[[/div]]

+ 主题颜色

[[include :scp-wiki:component:theme-squares -=-
| color1-name=月白
| color1-variable=--moonlight-white
| color1-info=(238, 247, 242)
| color2-name=莽丛绿
| color2-variable=--forest-green
| color2-info=(20, 30, 27)
| color2-has-light-text=1
| subcolor1-name=夜空蓝
| subcolor1-variable=--nightsky-blue
| subcolor1-info=(19, 72, 87)
| subcolor1-has-light-text=1
| subcolor2-name=玉簪绿
| subcolor2-variable=--jade-green
| subcolor2-info=(164, 202, 182)
| subcolor3-name=苍绿
| subcolor3-variable=--verdant-green
| subcolor3-info=(34, 62, 54)
| subcolor3-has-light-text=1
| subcolor4-name=泉绿
| subcolor4-variable=--spring-green
| subcolor4-info=(73, 117, 104)
]]

+ 元素示例

[[div class="movie"]]
[[include component:image-block name=https://scpsandboxcn.wdfiles.com/local--files/sharia-vanilla-translation2/mega-stw.gif|caption=这是图——等等这是什么？|width=200px]]
[[/div]]

可通过4个或更多连字符[[footnote]] 这是一种绝对严谨的表达，其目的为不激怒任何人。顺带一提这个是脚注。 [[/footnote]]“@@----@@”创建水平分割线。若它未被放在其他部件（诸如引用块）中，则会左右延伸贯穿页面。这种将文件分割为多个部分的线就是分割线。

----

标题可通过在一行字起始处输入 1 至 6 个加号“+”来创建。

~~~~

[[collapsible show="+ 折叠块" hide="- 收起"]]
+ 一级标题
++ 二级标题
+++ 三级标题
++++ 四级标题
+++++ 五级标题
++++++ 六级标题
[[/collapsible]]

[[tabview]]
[[tab 分页]]
此为分页（tab view）。
[[/tab]]
[[tab 分页]]
看，这有更多文字。

多么精巧绝伦。
[[/tab]]
[[tab 长 Tab]]
这是一个长的 tab，它有很多文字。

这是一个长的 tab，它有很多文字。

这是一个长的 tab，它有很多文字。

这是一个长的 tab，它有很多文字。

这是一个长的 tab，它有很多文字。

这是一个长的 tab，它有很多文字。

这是一个长的 tab，它有很多文字。

这是一个长的 tab，它有很多文字。

这是一个长的 tab，它有很多文字。

这是一个长的 tab，它有很多文字。

这是一个长的 tab，它有很多文字。

这是一个长的 tab，它有很多文字。
[[/tab]]
[[tab 由于一些奇怪的原因，这个空 tab 有一个很长的名字。我想知道为什么？这很奇怪。]]
[[/tab]]
[[tab 空 Tab]]
[[/tab]]
[[tab 空 Tab]]
[[/tab]]
[[tab 空 Tab]]
[[/tab]]
[[tab 空 Tab]]
没有规律也是一种规律，因为幻想本身便是一种毫无拘束的天马行空。实际上，正如同那些“造物”的消亡源自于幻想的断绝，其诞生也同样源自于对“飞空城”应当存在的幻想，或者说，信念。而这也是最后一座城堡依然存在的原因：想想，你是从什么时候开始坚信你一定会找到那座本该不一定存在的空中巨构的呢？那就是答案。
[[/tab]]
[[tab 空 Tab]]
[[/tab]]
[[/tabview]]

[[div class="blockquote"]]
这是一个引用块--，在一行字的起始处加上“> ”来创建--。

别这样干。用
[[div class="blockquote"]]
@@[[div class="blockquote"]]@@
内容
@@[[/div]]@@
[[/div]]

----

一条分割线

[[/div]]

||~ 这是 ||~ xlsx ||
|| 你应该知道 || 这个可以 ||
|||| 统计竞赛排名 ||

+ 组件

++ 翻页书

该模块支持展示最多10页不同内容。如果你需要更多页数，请参考本页源代码类比进行扩展。

你可以在各页面内部放置包括图片、脚注、盒结构在内的任意内容。

详细调用方法见下：

[[module css]]

.book.n1 > div:nth-of-type(n+3) { display: none; }

.book.n1:has(.collapsible-block-unfolded[style=""] span.page1, .collapsible-block-unfolded[style="display: block;"] span.page1) > div:nth-of-type(n):nth-of-type(-n+1) {
  display: none;
}

.book.n1:has(.collapsible-block-unfolded[style=""] span.page1, .collapsible-block-unfolded[style="display: block;"] span.page1) > div:nth-of-type(n+2):nth-of-type(-n+4) {
  display: block;
}

.book.n1:has(.collapsible-block-unfolded[style=""] span.page1, .collapsible-block-unfolded[style="display: block;"] span.page1) > div:nth-of-type(n+5) {
  display: none;
}

.book.n1:has(.collapsible-block-unfolded[style=""] span.page2, .collapsible-block-unfolded[style="display: block;"] span.page2) > div:nth-of-type(n):nth-of-type(-n+3) {
  display: none;
}

.book.n1:has(.collapsible-block-unfolded[style=""] span.page2, .collapsible-block-unfolded[style="display: block;"] span.page2) > div:nth-of-type(n+4):nth-of-type(-n+6) {
  display: block;
}

.book.n1:has(.collapsible-block-unfolded[style=""] span.page2, .collapsible-block-unfolded[style="display: block;"] span.page2) > div:nth-of-type(n+6) {
  display: none;
}

[[/module]]

[[div class="blockquote"]]
@@[[include :scp-wiki-cn:theme:marchen pagebook-start=-- | bookNo=1 | height=20em]]@@[[footnote]] 不同的书册请使用不同的书本编号。 [[/footnote]]
@@[[div class="book-content"]]@@
这是第一页。
@@[[/div]]@@
@@[[include :scp-wiki-cn:theme:marchen paging=-- | pageNo=1]]@@[[footnote]] 翻页模块的页面编号依序上升。最后一页内容之后不需要加入翻页模块。 [[/footnote]]
@@[[div class="book-content"]]@@
这是第二页。
@@[[/div]]@@
@@[[include :scp-wiki-cn:theme:marchen paging=-- | pageNo=2]]@@
@@[[div class="book-content"]]@@
这是第三页。
@@[[/div]]@@
@@[[include :scp-wiki-cn:theme:marchen pagebook-end=--]]@@
[[/div]]

----

[[div class="blockquote wide book n1" style="height: 20em;"]]
[[div class="book-content"]]
[[include component:image-block
|name=https://scpsandboxcn.wdfiles.com/local--files/breaddddd/bard-white.png
|caption=图6.1 “吟游诗客”(GoI-874)公认徽标
|width=min(30vw, 200px) !important
]]
“吟游诗客”是一个低活跃的异常艺术家组织。该组织唯一可以确定的前身组织“深林童谣会” (Märchen im Mori, MiM) [[footnote]] 此处为通行译名，正名应为“死亡童谣会”。该译名为二次翻译错误转录后的约定俗成。 [[/footnote]]发源于文艺复兴时期的日耳曼地区，其成员包含这一时期在常态社会中高度活跃的数位著名画家、作者及诗作家。相关记载表明，这一组织首次将异常技术运用在了增强文艺作品的表现形式之上，用以批判中世纪时期的黑暗社会制度以及宗教思想对人文精神的束缚。此后，该组织在吸纳了分布在东欧、西亚以及南美等地的多个新兴异常艺术团体后，于18世纪中叶重组为了今天的吟游诗客。
[[/div]]
[[div class="paging"]]
[[collapsible show=" " hide=" "]]
[[span class="page1"]]@@ @@[[/span]]
[[/collapsible]]
[[/div]]
[[div class="book-content"]]
重组后，吟游诗客将其使命确定为“吟唱失落的幻想乐章”。也即，通过编纂诗作、童话以及民间故事并加以扩散、传播的方式让即将消逝的文化、传说乃至真实存在的异常得以延续。因此，这一组织随即吸引了一些历史学家、民俗学家的加入，并参与了故事的创作与传播，雅各布·格林与威廉·格林兄弟是其中的典型例证。18世纪末以来，吟游诗客在世界各地的活跃程度到达了顶峰——目前，约八成现存于世的，确认为由该组织创作的异常书籍/艺术作品都创作于1760年~1930年这一区间。二十世纪中叶以来，这一组织的活跃程度开始缓慢稳定地下降，主要表现为出产作品以及活跃相关人士的滑坡式减少。以基金会获取的相关事件报告为代表，其数量已从1948年的717例下降至2022年的4例。
[[/div]]
[[div class="paging"]]
[[collapsible show=" " hide=" "]]
[[span class="page2"]]@@ @@[[/span]]
[[/collapsible]]
[[/div]]
[[div class="book-content"]]
吟游诗客的成员大都自称为“歌吟者”。与他们的前身组织深林童谣会类似，“歌吟者”们的作品大多具有一定的异常特性，但此类异常往往不具备危险性，而是主要聚焦于对所述故事的“展示”与“流传”。今天的“歌吟者”们大多投身于幻想造物以及与此相关的古老神话、民俗传说的保护事业之中，因此在诸多领域中与Site-CN-53达成了密切合作关系。
[[/div]]
[[/div]]

++ 便携索引模块

在文章的开头部分添加以下代码以呼出便携的索引模块：

> @@[[include :scp-wiki-cn:theme:marchen portable-toc=--]]@@

这一模块的效果已经在本页面中应用，位于页面的右上角。此外，你可以换用以下代码以自定义索引模块：

[[div class="blockquote"]]
@@[[div class="port-toc"]]@@
@@[[collapsible show="◀" hide="◁"]]@@
你希望往自定义索引中添加的内容
@@[[/collapsible]]@@
@@[[/div]]@@
[[/div]]

[[div class="port-toc"]]
[[collapsible show="◀" hide="◁"]]
[[toc]]
[[/collapsible]]
[[/div]]

++ 选择分支

该模块支持在页面中嵌入选择分支。

你可以在各分支下放置包括图片、脚注、盒结构在内的任意内容，甚至嵌套选择。

详细调用方法见下：

[[div class="blockquote"]]
@@[[include :scp-wiki-cn:theme:marchen@@
@@| selres-part1=-- @@
| selectionNo=1 [[footnote]] 不同的一组选择分支请使用不同的编号。 [[/footnote]]
@@]]@@
选择支A的说明文本
@@[[include :scp-wiki-cn:theme:marchen selres-part2=--]]@@
选择支B的说明文本
@@[[include :scp-wiki-cn:theme:marchen selres-part3=--]]@@
进入选择支A后的展示内容
@@[[include :scp-wiki-cn:theme:marchen selres-part4=--]]@@
进入选择支B后的展示内容
@@[[include :scp-wiki-cn:theme:marchen selres-part5=--]]@@
[[/div]]

----

[[module css]]

.selres.n1:has(.collapsible-block-unfolded[style=""] span.branchA, .collapsible-block-unfolded[style="display: block;"] span.branchA) > div.a {
  display: block;
}

.selres.n1:has(.collapsible-block-unfolded[style=""] span.branchB, .collapsible-block-unfolded[style="display: block;"] span.branchB) > div.b {
  display: block;
}

[[/module]]

[[div class="selres n1"]]

[[div class="selection"]]

[[div class="selA"]]

[[div class="sel-display"]]
我理解你的苦难，
但是，世俗的枷锁可不是什么能轻易摆脱的东西啊。
这样的话，试试不小心爱上《那一个人》如何？
[[/div]]

[[collapsible show="　" hide="　"]]
[[span class="branchA"]]@@ @@[[/span]]
[[/collapsible]]

[[/div]]

[[div class="selB"]]

[[div class="sel-display"]]
如果仅仅只是逃避的话，
躲到深邃的树林中后一切自然一了百了。
你的愿望将会实现，但这真的是你想要得到的【幸0304】吗？
[[/div]]

[[collapsible show="　" hide="　"]]
[[span class="branchB"]]@@ @@[[/span]]
[[/collapsible]]

[[/div]]

[[/div]]

[[div class="result a"]]
这里是结局一。
[[/div]]

[[div class="result b"]]
这里是结局二。
[[/div]]

[[/div]]

++ 选择器警告

本版式的翻页书组件与选择分支组件均依赖于:has选择器运作。这意味着一些版本较为落后的浏览器可能在使用上述功能时遇到问题。

如果你使用了这些组件，可以在页面开始处引用下面这段代码调用预设的选择器警告。

> @@[[include :scp-wiki-cn:theme:marchen has-warning=--]]@@

该警告在生效时大概长这样：

[[div class="error-block"]]
如果您看到了这段文字，那么您使用的浏览器很可能并不支持本文章的全部展示效果。

如果您希望体验完整的文章内容，请换用电脑端或升级到浏览器的最新版本后再进行阅读。
[[/div]]

如果分隔线下面没有相同的内容，那么说明你使用的浏览器支持:has选择器。

----

[[div class="error-block has-warning"]]
如果您看到了这段文字，那么您使用的浏览器很可能并不支持本文章的全部展示效果。

如果您希望体验完整的文章内容，请换用电脑端或升级到浏览器的最新版本后再进行阅读。
[[/div]]

+ 其他元素

++ 装饰分隔线

如果将“@@----@@”放入类（class）为 “fancyhr” 的 div 元素中，则可以显示另一种水平线样式，如下所示：
> @@[[div_ class="fancyhr"]]@@
> @@----@@
> @@[[/div]]@@

效果如下：

[[div_ class="fancyhr"]]
----
[[/div]]

++ 首字母装饰

将你的文本内容放在类为letterdeco的div元素中时，其首段的首个字符将被放大。

如下是一个使用范例：

[[div class="blockquote"]]
@@[[div class="blockquote letterdeco"]]@@
文本内容
@@[[/div]]@@
[[/div]]

----

[[div class="blockquote letterdeco"]]
自英国之旅结束后，一连数天，我在梦中拜访那片肆虐着风暴的荒原——又或者，我该说，混杂幽蓝色垂幕的，焦黑的天穹一连数天不加申请地闯入我的睡梦——雷和雨不停歇地轰鸣，水雾像是真正的泥沼一样漫过膝盖，天和地的距离因此不断拉近，像是老鼠在缓缓合上它的巨口。

而在那上方——在那座突兀的山巅之上，汇聚成倒悬黑海的云层上，城市的穿透气层和星云的阶梯之上——有什么在漂浮着。我只能看见它长到无法收起，又或是全然不以为意，于是在翻涌的天幕中如锚般稳固，惬意地摇曳着的触须末端。那些肢体是水蓝色的，通体澄澈，我能透过表皮看见其中流淌着浓浆的脉络。

若是将注意力放在它们身上，我将有如同头盖骨向正上方分离一般的触感，以穿行于脑皮层上的凉意和眼球被扯动的感知为主；因此，我有理由据信，每每我入梦之后，正是这些触须，穿过我的颅骨如鱼线窜入水面，将我向上抽离至这样的场所中来。

在具晓它究竟有何旨意前，我大概无能，无力也无胆向任何已知的神明祈祷。
[[/div]]

++ 花体拉丁字母

将你的文本内容放在类为decorated的div元素或span元素中时，其中的拉丁字母将变为花体。

注意：header元素中的文本将默认应用这一样式。

[[div class="blockquote"]]
@@[[span class="decorated"]]Alle Menschen sind frei und gleich an Würde und Rechten geboren. [[/span]]@@
----
[[span class="decorated"]]Alle Menschen sind frei und gleich an Würde und Rechten geboren. [[/span]]
[[/div]]

----

+++ 页眉、标题处装饰字体为 Unifraktur Maguntia / 思源宋体 。

= 正文字体为思源黑体。

++ //平行//引入的其余样式

+++ 表格

[[div class="table dborder"]]
||~ 这是 ||~ 暗边缘表格 ||
|| 把表格放进 || {{@@[[div class="table dborder"]]@@}} ||
||||来做这个 ||
[[/div]]

@@ @@

[[div class="table wide"]]
||~ 这是 ||~ 加宽表格 ||
|| 把表格放进 || {{@@[[div class="table wide"]]@@}} ||
||||来做这个 ||
[[/div]]

@@ @@

[[div class="table three-lines"]]
||~ 这是 ||~ 三线表 ||
|| 把表格放进 || {{@@[[div class="table three-lines"]]@@}} ||
||||来做这个 ||
[[/div]]

+++ div

[[div class="blockquote wide"]]
{{@@[[div class="blockquote wide"]]@@}}
[[/div]]

[[div class="blockquote bordered"]]
{{@@[[div class="blockquote bordered"]]@@}}
[[/div]]

[[div class="blockquote thin-bordered"]]
{{@@[[div class="blockquote thin-bordered"]]@@}}
[[/div]]

[[div class="blockquote bordered dborder"]]
{{@@[[div class="blockquote bordered dborder"]]@@}}
[[/div]]

[[div class="blockquote thin-bordered dborder"]]
{{@@[[div class="blockquote thin-bordered dborder"]]@@}}
[[/div]]

[[div class="blockquote notation"]]
{{@@[[div class="blockquote notation"]]@@}}
[[/div]]

[[div class="blockquote title" data-title="示例标题"]]
{{@@[[div class="blockquote title" data-title="示例标题"]]@@}}

这个的部分代码是从[[[theme:lumina|流明冲击]]]偷的。
[[/div]]


+ 版式源代码

[[collapsible show="+ 查看源代码" hide="- 收起"]]

[[code type="css"]]
@import url('https://scp-wiki-cn.wikidot.com/local--code/fragment:parallel/1');

@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@100;300;400;500;700;900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=UnifrakturMaguntia&display=swap');

:root{
  --moonlight-white: 238, 247, 242;
  --forest-green: 20, 30, 27;
  --verdant-green: 34, 62, 54;
  --nightsky-blue: 19, 72, 87;
  --spring-green: 73, 117, 104;
  --jade-green: 164, 202, 182;

  --main-padding: clamp(1rem, calc((100dvw - var(--main-content-width)) / 2), 12rem);
  --top-height: 60vh;
  --bot-height: 6rem;
  --head-grad: 6rem;

  --basalt-primary-color: var(--forest-green);
  --basalt-secondary-color: var(--verdant-green);
  --basalt-tertiary-color: var(--nightsky-blue);
  --basalt-main-text-color: var(--moonlight-white);
  --basalt-overtone: var(--moonlight-white);
  --basalt-undertone: var(--jade-green);
 
  --basalt-bright-element-color: var(--forest-green);
  --basalt-dark-element-color: var(--verdant-green);
  --basalt-darker-element-color: var(--spring-green);

  --header-title-color: var(--main-text-color);
  --header-subtitle-color: var(--main-text-color);
 
  --top-bar-link-color: var(--basalt-overtone);
 
  --UI-title-color: var(--jade-green);
  --UI-title-background-color: var(--basalt-secondary-color);

  --side-bar-button-color: var(--basalt-main-text-color);
  --search-icon-color: var(--basalt-main-text-color);
  --search-icon-color-hover: var(--basalt-undertone);
  --side-bar-link-color-hover: var(--basalt-undertone);
  --hr-color: var(--basalt-main-text-color);
  --tab-hover-background-color: var(--nightsky-blue);
  --side-bar-background-color: var(--verdant-green);
  --rate-module-background-color: var(--forest-green);

  --top-bar-dropdown-link-color: var(--basalt-main-text-color);
  --top-bar-dropdown-link-color-hover: var(--jade-green);
  

  --logo: url(https://scpsandboxcn.wdfiles.com/local--files/breaddddd/bard-white.png);

  --arrow-img: url(https://scpsandboxcn.wdfiles.com/local--files/breaddddd/bard-corner1.png);

  --bg-img: url(https://scpsandboxcn.wdfiles.com/local--files/collab%3Acastle-tracer/deepforest.svg);
  /* https://publicdomainvectors.org/en/free-clipart/Digital-night-forest-illustration/78901.html PD */

  --header-img: url(https://scpsandboxcn.wdfiles.com/local--files/collab%3Acastle-tracer/Trees-Landscape.svg);
  /* https://publicdomainvectors.org/en/free-clipart/Trees-landscape/49341.html PD */

  --footer-img: url(https://scpsandboxcn.wdfiles.com/local--files/collab%3Acastle-tracer/Footer-Trees.svg);
  /* https://publicdomainvectors.org/en/free-clipart/Maui-sunset-silhouette/79734.html PD */

  --sep-line: url(https://scpsandboxcn.wikidot.com/local--files/collab:castle-tracer/Ivy-Leaves.svg);
  /* https://freesvg.org/1538965145 PD */

  --title: "吟游诗客";
  --subtitle: "Märchen erben Fantasien";
}

@media (max-width: 1024px) {
  :root{
    --top-height: 30vh;
    --bot-height: 3rem;
  }
}

/* header */

#header {
  background: none;
  box-shadow: none;
}

#header h1 a { padding-right: calc(var(--base-header-height)*0.25); }

#header h1 a::before { 
  margin-right: 0; 
  mask-image: linear-gradient(to top, #000F 0%, 80%, #0000 100%);
  -webkit-mask-image: linear-gradient(to top, #000F 0%, 80%, #0000 100%);
}

#header h1 a span { display: none; }

#header h1 {
  background-color: rgb(var(--basalt-darker-element-color));
}

#header div.mobile-top-bar > .open-menu {
  background-color: rgb(var(--basalt-darker-element-color));
  visibility: unset;
}

#header #top-bar ul {
  background: linear-gradient(to right, rgb(var(--basalt-darker-element-color)) 0%, rgb(var(--basalt-darker-element-color)) 20%, rgb(var(--basalt-dark-element-color), 0.8) 60%, rgba(var(--basalt-bright-element-color), 0.2) 100%);
  border-bottom-right-radius: calc(var(--base-header-height)*2.5) var(--base-header-height);
  margin-right: calc(var(--base-header-height)*2);
}

#header #top-bar ul > li > a {
  font-size: calc(var(--true-font-size) *0.9);
}

#search-top-box::before {
  background: none;
}

#login-status::after {
  background: none;
}

@media (max-width: 1024px) {
  #header h1 { background: none; }
  #header div.mobile-top-bar > .open-menu {
    background: none;
    visibility: visible;
  }
  #header #top-bar ul {
    background: none;
    border-bottom-right-radius: 0;
    margin-right: 0;
  }
  #header h1 a span { display: flex; }
  #header h1 a span::after, #header h1 a span::before {
    font-family: 'UnifrakturMaguntia', 'Noto Serif SC', serif;
  }
  #header h1 a span::after {
    letter-spacing: 0;
  }
  #header {
    background: linear-gradient(to right, rgb(var(--basalt-darker-element-color)) 0%, rgb(var(--basalt-darker-element-color)) 20%, rgb(var(--basalt-dark-element-color), 0.8) 60%, rgba(var(--basalt-bright-element-color), 0.2) 100%);
  }
}

/* page body */

body {
  background-color: rgb(var(--forest-green));
}

body::before {
  content: "";
  position: fixed;
  top: 50%;
  left: 50%;
  width: 100vw;
  height: 100vh;
  transform: translate(-50%, -50%);
  background: var(--bg-img) no-repeat center;
  background-size: cover;
  opacity: .575;
  z-index: -2;
  pointer-events: none;
}  /* taken from lumina */

#main-content::before {
  content: "";
  position: absolute;
  top: 0%;
  left: 0%;
  width: 100%;
  aspect-ratio: 5 / 2;
  transform: translate(0, -96%);
  background: var(--header-img) no-repeat bottom;
  background-size: cover;
}

#main-content {
  position: relative;
  margin-top: var(--top-height);
  margin-bottom: 0;
  padding: 2rem var(--main-padding);
  padding-bottom: var(--bot-height);
  background: linear-gradient(to bottom, #000 0%, rgba(var(--forest-green), 0.7) var(--head-grad) 100%);
}

#page-title, .meta-title {
  position: absolute;
  top: calc(0% - (var(--top-height) - var(--base-header-height)) *.6);
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 400%;
  border-bottom: none;
  font-family: 'UnifrakturMaguntia', 'Noto Serif SC', serif;
}

@media (max-width: 1024px) {
  #main-content {
    --main-content-side-margin: 0;
    margin-inline: 0;
    box-sizing: border-box;
    width: 100vw;
  }
  #page-title, .meta-title { font-size: 280%; }
}

@media (max-width: 640px) {
  #page-title, .meta-title { font-size: 160%; }
}

/* footer bar */

#footer {
  position: relative;
  border-top: none;
  background-color: black;
  color: var(--basalt-main-text-color);
  overflow: unset;
}

div#license-area {
  background-color: black;
  color: var(--basalt-main-text-color);
}

#footer a, div#license-area a {
  color: var(--basalt-main-text-color);
}

#footer::before {
  content: "";
  position: absolute;
  top: 0%;
  left: 0%;
  width: 100%;
  aspect-ratio: 5 / 2;
  transform: translate(0, -100%);
  background: var(--footer-img) no-repeat bottom;
  background-size: cover;
  pointer-events: none;
}

#footer .options {
  border-right: none;
}

#edit-page-textarea {
  position: relative;
  z-index: 1;
}

/* side bar */

:is(#side-bar, #interwiki) .menu-item a::before {
  transition: none;
}

#side-bar .collapsible-block-content::after {
  background-color: rgb(var(--jade-green));;
}

#side-bar .collapsible-block-content {
  background-color: rgb(var(--verdant-green));
}

/* IN PAGE ITEMS */

h1, h2, h3, h4, h5, h6 {
  text-align: center;
  margin-top: 0.7em;
  margin-bottom: 0.7em;
  font-family: 'UnifrakturMaguntia', 'Noto Serif SC', serif;
}

li:not(:first-child) {margin-top: 0.75em;}

ul, ol {padding-left: 10px;}

:is(.blockquote, blockquote, .code) :is(.blockquote, blockquote, .code) {
  box-shadow: none;
  border: none;
  background-color: rgba(var(--forest-green), 0.6);
}

div#main-content :is(.blockquote, blockquote, .code) > hr {
  background-color: rgb(var(--basalt-main-text-color));
}

.decorated {
  font-family: 'UnifrakturMaguntia', 'Noto Serif SC', serif;
}

div#main-content div.blockquote.notation {
  border: 6px double rgb(var(--jade-green));
}

#main-content > .page-tags > span a:hover {
  position: relative;
  z-index: 1;
}

#who-rated-page-area > div span:nth-of-type(2n+1):is(:hover, :focus-within), #who-rated-page-area > div span:nth-of-type(2n+1):is(:hover, :focus-within) + span[style*="color"] {
  position: relative;
  z-index: 1;
}

/* anchor */

a:link, a:visited {
    color: inherit;
    text-decoration: currentcolor solid underline;
}

a:hover, a:active {
    background-color: rgb(var(--moonlight-white));
    color: rgb(var(--forest-green));
    text-decoration: rgb(var(--forest-green)) solid underline;
}

#page-options-bottom > a:hover, #page-options-bottom-2 > a:hover {
    color:rgb(var(--forest-green));
}

#main-content > .page-tags > span a:is(:hover, :focus) {
   background-color: rgb(var(--basalt-main-text-color));
}

/* credit and standalone */

div.rate-box-with-credit-button,
div.page-rate-widget-box {
  box-shadow: 0 calc(0rem - var(--base-border-width)) 0 rgb(var(--verdant-green));
}

div.rate-box-with-credit-button div.page-rate-widget-box {
  box-shadow: none;
}

div.page-rate-widget-box span.btn > a , div.rate-box-with-credit-button span.btn > a {
  border-bottom-color: rgb(var(--forest-green));
}

.creditButtonStandalone a.fa.fa-info {
  box-shadow: 0 calc(0rem - var(--base-border-width)) 0 rgb(var(--verdant-green));
}

.creditButtonStandalone a.fa.fa-info::before {
  background-color: rgb(var(--forest-green));
}

.creditButtonStandalone a.fa.fa-info:hover::before {
  background-color: rgb(var(--forest-green));
  border-bottom: var(--base-border-width) solid rgb(var(--moonlight-white));
}

.creditButtonStandalone a.fa.fa-info::after {
  background-color: rgb(var(--moonlight-white));
}

/* ruby fix from scp-cn-2512 */

p:has(span.ruby) {
    line-height: 1.7;
}

span.ruby {
    height: unset;
    display: inline-flex;
    flex-direction: column-reverse;
    align-items: center;
    vertical-align: top;
}

span.rt {
    display: block;
    margin-top: -0.625em;
    margin-bottom: 0;
    line-height: 1.25;
}

/* code fix */
.code {
    --_reserved: 114, 162, 247;
    --_number: 237, 123, 163;
    --_string: 93, 178, 107;
    --_quotes: 93, 178, 107;
    --_special: 0, 183, 159;
    --_var: 193, 154, 73;
    margin: 1.5rem 0;
}

/* has check */

.has-warning {display: none;}
@supports not selector(:has(.collapsible-block-unfolded[style="display: block;"] span.branchA)) {
  .has-warning {display: block;}
}

/* paging book */

div.book {
  display: flex;
  border: 6px double rgb(var(--jade-green));
  padding: 0 0.5em;
  --paging-width: 3em;
}

.book-content {
  flex: 1;
  padding: 0 0.5em;
  overflow-y: scroll;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.book-content::-webkit-scrollbar {
  display: none;
}

.book div.book-content:first-of-type {
  padding-left: calc(var(--paging-width) + 0.5em);
}

.book div.book-content:last-of-type {
  padding-right: calc(var(--paging-width) + 0.5em);
}

.paging {
  width: var(--paging-width);
  align-self: stretch;
}

.paging :is(.collapsible-block, .collapsible-block-folded, .collapsible-block-unfolded, .collapsible-block-unfolded-link) {
  height: 100%;
}

.paging a.collapsible-block-link {
  display: block;
  width: var(--paging-width);
  height: 100%;
  color: transparent;
  text-decoration: none;
  background: var(--arrow-img) no-repeat center;
  background-size: calc(var(--paging-width) * 1.5) auto;
  background-position: left 30% center;
}

.paging a.collapsible-block-link:hover,  .paging a.collapsible-block-link:active {
  color: transparent;
  text-decoration: none;
}

.paging .collapsible-block-folded a.collapsible-block-link {
  transform: scaleX(-1);
}

.paging p {
  margin: 0;
}

.paging .collapsible-block span {
  display: block;
  font-size: 0;
  height: 0;
}

@supports not selector(:has(.collapsible-block-unfolded[style="display: block;"] span.branchA)) {
  div.book { 
    display: block;
    height: fit-content !important;
  }
  div.book-content { display: block !important; }
  div.paging { display: none !important; }
  .book div.book-content:first-of-type {
    padding-left: 0.5em;
  }
  .book div.book-content:last-of-type {
    padding-right: 0.5em;
  }
  /* paging fix for nan-has users */
}

@media (max-width: 1024px) {
  div.book {
    --paging-width: 2em;
  }
}

/* selres */

.selection {
  display: flex;
  column-gap: 2rem;
  margin-inline: 2rem;
}

.selection :is(.selA, .selB) {
  flex: 1;
  margin-inline: auto;
  padding: 0.5rem;
  display: grid;
  grid-template-columns: 1fr;
  justify-content: center;
  align-items: center;
  background-color: transparent;
  border: 6px double rgb(var(--jade-green));
  transition: border-color 1s;
}

.selection :is(.selA, .selB):hover {
  border-color: rgb(var(--verdant-green));
}

.selection :is(.selA, .selB) :is(.sel-display, .collapsible-block) {
  grid-area: 1 / 1 / span 1 / span 1;
}

.selection :is(div.collapsible-block, div.collapsible-block-folded, div.collapsible-block-unfolded, div.collapsible-block-unfolded-link, a.collapsible-block-link) {
  display: block;
  width: 100%;
  height: 100%;
}

.selection .collapsible-block a.collapsible-block-link {
  text-decoration: none;
}

.selection .collapsible-block a.collapsible-block-link:hover {
  background-color: transparent;
}

.selection .collapsible-block p {
  margin: 0;
}

.selection .collapsible-block span {
  display: block;
  font-size: 0;
  height: 0;
}

.result {
  display: none;
}

.selection:has(.collapsible-block-unfolded[style=""] span.branchA, .collapsible-block-unfolded[style="display: block;"] span.branchA) > div:last-of-type {
  display: none;
}

.selection:has(.collapsible-block-unfolded[style=""] span.branchB, .collapsible-block-unfolded[style="display: block;"] span.branchB) > div:first-of-type {
  display: none;
}

/* big letter */

.letterdeco p:first-of-type::first-letter{
    margin-top: 0.3em;
    font-size: 2em;
    font-weight: bold;
    float: left;
    margin-right: 0.1em;
    font-family: "Noto Serif SC", serif;
}

/* fancy hr */

.fancyhr hr {
  height: 2rem;
  background: var(--sep-line) repeat center bottom;
  background-size: contain;
  mask-image: linear-gradient(to right, #0002 0%, 15%, #000 50%, 85%, #0002 100%);
  -webkit-mask-image: linear-gradient(to right, #0002 0%, 15%, #000 50%, 85%, #0002 100%);
  filter: brightness(66%) saturate(125%) sepia(50%);
}

/* portable toc */

.port-toc {
  position: fixed;
  z-index: 10;
  top: calc(var(--base-header-height)*2);
  right: 0;
}

.port-toc .collapsible-block-unfolded {
  display: grid;
  grid-template-columns: 1fr 1.5rem;
}

.port-toc .collapsible-block-unfolded-link {
  grid-area: 1 / 2 / span 1 / span 1;
}

.port-toc .collapsible-block-content {
  grid-area: 1 / 1 / span 1 / span 1;
}

.port-toc a.collapsible-block-link {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 1.5rem;
  height: 5rem;
  background-color: rgb(var(--spring-green));
  text-decoration: none;
}

.port-toc a.collapsible-block-link:hover, .port-toc a.collapsible-block-link:active {
  color: rgb(var(--moonlight-white));
}

.port-toc #toc {
  margin: 0;
}

[[/code]]

亮色（？）配色：

[[code type="css"]]

:root {
  --moonlight-white: 238, 247, 242;
  --forest-green: 77, 16, 24;
  --verdant-green: 90, 18, 22;
  --nightsky-blue: 75, 30, 47;
  --spring-green: 166, 27, 41;
  --jade-green: 192, 142, 175;

  --bg-img: url(https://scpsandboxcn.wdfiles.com/local--files/collab%3Acastle-tracer/town-background.svg);
  /* https://publicdomainvectors.org/en/free-clipart/Drawing-of-medieval-town-panorama-in-color/34957.html PD */

  --outside-black: 45, 12, 19;

  --basalt-UI-dark-palette: var(--outside-black);
  --basalt-light-text-color: var(--moonlight-white);
}

#main-content::before, 
#footer::before {
  display: none;
}

#main-content {
  background: rgba(228, 214, 205, 0.7);
}

/* text color */

#page-content {
  color: rgb(var(--outside-black));
}

#page-content :is(div.blockquote, blockquote, .code, .footnotes-footer, div#toc, div#page-title, div.meta-title, div.scp-image-caption), div#lock-info {
  color: rgb(var(--moonlight-white));
}

div#page-options-container, div#action-area {
  color: rgb(var(--outside-black));
}

.selection a.collapsible-block-link:hover, .port-toc a.collapsible-block-link:active {
  color: rgb(var(--outside-black));
}

/* hr */

#page-content hr {
  background-color: rgb(var(--outside-black));
}

#page-content :is(div.blockquote, blockquote, .code, .footnotes-footer, div#toc) hr{
  background-color: rgb(var(--moonlight-white));
}

#page-content .fancyhr hr {
  background-color: transparent;
}

[[/code]]

[[/collapsible]]

[[/iftags]]