很久很久以前 版式

使用方法

将以下代码粘贴到页面的顶部：

[[include :scp-wiki-cn:wanderers:once-upon-a-time]]

+ 我喜欢这个版式但想改一下颜色，该怎么做？

首先你要调整页眉标题和标志的颜色。我把它们的PSD文件放在了本页里，下载并修改每个我标记为“HERE”的图层。或者，你可以通过复制同样的构图来制作新的你想要的。

你做完后，保存并上传到你的页面附件里，粘贴下方的代码到你页面的顶部，复制你图片的链接，替换 "--gradient-header" 一项里 “HERE” 的占位以更换页眉图片，替换 "--logo-image" 一项以更改标志。

之后，选择你钟意的 RGB 色码，然后替换相应位置。

记得加上分号！

[[module CSS]]
:root {
/*Header*/
--gradient-header: url("HERE");
--logo-image: url("HERE");

/* Theme colors*/
—white-monochrome: R, G, B;
/*dark brown page color*/

—gray-monochrome: R, G, B;
/* red */

—dark-gray-monochrome: R, G, B;
/* orange */

—light-gray-monochrome: R, G, B;
/* yellow */

—bright-accent: R, G, B;
/* gold */

—shadow-accent: R, G, B, A;
/* 你懂的。这个的话，确保你要的透明度的 A 值处于0 - 1之间。*/
}
[[/module]]

示例

可通过五个连字符“-----”创建水平分割线。若它未被放在其他部件（诸如引用块）中，则会左右延伸贯穿页面。这种将文件分割为多个部分的线就是分割线。

---

该版式修改了 fancyhr 的默认纹理，可以将 "-----" 置入类名 "fancyhr" 的 div 块，像这样：

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

效果如下：

---

我也改变了 fancyborder 的纹理，像这样：

[[div_ class="fancyborder"]]
content goes here
[[/div]]

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

+ 标题

1 级标题

2 级标题

3 级标题

4 级标题

5 级标题

6 级标题

分页

此为分页（tab view）。

分页

看，这有更多文字。

多么精巧绝伦。

长 Tab

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

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

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

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

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

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

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

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

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

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

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

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

空 Tab

空 Tab

空 Tab

空 Tab

空 Tab

空 Tab

这是一个引用块，在一行字的起始处加上“> ”来创建。

更多文字

---

一条分割线

嵌套引用块¹

这是	表格
你应该老早	就知道怎么
做这个了吧

标题字体为：Quintessential / 瑞美加张清平硬笔楷书
代码块和底部按钮字体为：Merienda / 王汉宗中魏碑
编辑器字体为：Raleway.

+ 源代码

/* Once Upon A Time WL Theme by IronShears
*    Built on Dust Jacket by Woedenaz which was built on Black Highlighter by Woedenaz and Croquembouche
* Paper texture by Brent Leimenstoll and edited by IronShears, released under CC-BY-SA 2.0: https://www.flickr.com/photos/48046976@N08/8416357035
* Header image, gold foil texture, and logo by IronShears, released under CC-BY-SA 3.0
* Fonts used are  */
 
/*dust jacket import*/
@import url("https://scp-wiki-cn.wdfiles.com/local--code/wanderers%3Adustjacket-theme/1");
 
/*font-imports*/
@import url('https://fonts.googleapis.com/css2?family=Quintessential&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Merienda:wght@700');
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@600');
 
:root:lang(cn){
    /* Fonts */
--body-font: 'Quintessential', 'Ramega ZhangQingpingYingbiKaishu', 'YRDZST', cursive;
--title-font: 'Quintessential', 'Ramega ZhangQingpingYingbiKaishu', 'YRDZST',  cursive;
}
 
:root {
/*Header*/
    --gradient-header: url("https://wanderers-library.wdfiles.com/local--files/component%3Aonce-upon-a-time/OUATGenericHeader");
    --logo-image: url("https://wanderers-library.wdfiles.com/local--files/component%3Aonce-upon-a-time/OnceUponATimeLogo");
   --paper-texture: url("https://wanderers-library.wdfiles.com/local--files/component%3Aonce-upon-a-time/papertexture.png");
   --gold-foil: url("https://wanderers-library.wdfiles.com/local--files/component%3Aonce-upon-a-time/OnceUponATimeFoil.jpg");
--fancy-border: url("https://wanderers-library.wdfiles.com/local--files/component%3Aonce-upon-a-time/OnceUponATime-hr");
--fancy-hr: url("https://wanderers-library.wdfiles.com/local--files/component%3Aonce-upon-a-time/fancyborder");
 
/* Theme colors*/
    --white-monochrome: 44, 33, 25;
/*dark brown page color*/
 
    --light-pale-gray-monochrome: 190, 166, 147;
    /* off-white paper edge color */
 
    --gray-monochrome: 133, 63, 66;
    /* red */
 
    --dark-gray-monochrome: 177, 104, 71;
    /* orange */
 
    --light-gray-monochrome: 204, 134, 80;
    /* yellow */
 
    --bright-accent: 241, 194, 85;
    /* gold */
 
    --dark-accent: 29, 28, 31;
    /* black for Editor text/code/smallest nested blockquotes */
 
--shadow-accent: 32, 1, 0, .4;
 
    --alt-accent:  var(--bright-accent);
    --very-light-gray-monochrome: var(--white-monochrome);
    --medium-accent: var(--bright-accent);
--swatch-menubg-color: var(--light-gray-monochrome);
--swatch-text-tertiary-color: var(--dark-accent);
--swatch-secondary-color: var(--alt-accent);
    --black-monochrome: var(--bright-accent);
}
 
/*Header*/
 
div#extra-div-1 {
    background: var(--gradient-header);
    background-repeat: repeat;
    background-position: center;
    background-size: auto 100%;
}
 
#login-status #account-options{
background-image: var(--paper-texture);
  background-repeat: repeat;
  background-position: center;
border-top: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-right: none !important;
border-left: none !important;
border-bottom: none !important;
box-shadow: 3px 3px 3px rgba(var(--shadow-accent));
}
 
#header h1 a::before{
text-shadow: 3px 3px 3px rgba(var(--shadow-accent));
}
 
#header h1 a,
#header h1 a::before,
#header h1 a::after {
    color: rgb(var(--bright-accent));
}
 
#header h1 a::after {
  background-repeat: repeat;
  background-position: center;
background-size: initial;
    background-image: var(--gold-foil) !important;
}
 
#page-title::before,
.meta-title::before,
#page-title::after,
.meta-title::after {
    background-image: var(--gold-foil) !important;
}
 
.fancyborder {
border-image: var(--fancy-hr) 600 round;
    border-image-width: 6;
}
 
.fancyhr>hr {
background-image: none !important;
border-image-source: var(--fancy-border);
}
 
hr {
    background: var(--gold-foil) !important;
height: .125rem;
    border: 0;
    border-top: 0.0625rem solid transparent;
background-color: rgba(var(--bright-accent));
    background-size: cover;
}
 
#header::before {
opacity: 1;
}
 
#top-bar{
--dropdown-bg-color: var(--dark-gray-monochrome);
}
 
#header div[class*=top-bar]>ul>li ul>li{
background-image: var(--paper-texture) !important;
margin-top: 5px !important;
border-left: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-top: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
box-shadow: 3px 3px 3px  rgba(var(--shadow-accent));
}
 
#header div[class*=top-bar]>ul>li ul>li.sfhover{
background-image: var(--paper-texture) !important;
background-image: none !important;
margin-top: 5px !important;
border-left: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-top: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
box-shadow: 3px 3px 3px  rgba(var(--shadow-accent));
}
 
#top-bar > div.top-bar > ul > li.newpage > ul:first-of-type > li:first-of-type:hover{
 
background-image: var(--paper-texture) !important;}
 
#top-bar div.top-bar div.newpage_dropdown div.new-page-box input.button{
background-color: rgb(var(--light-gray-monochrome)) !important;
}
 
/*blockquotes*/
blockquote{
  background-repeat: repeat;
  background-position: center;
border-right: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-bottom: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-left: none !important;
border-top: none !important;
box-shadow: inset 5px 5px 5px  rgba(var(--shadow-accent)) !important;
padding:15px;
margin-top: 15px;
margin-left: 3.44%;
margin-right: 3.44%;
background-color: rgb(var(--gray-monochrome)) !important;
background-image: var(--paper-texture);
}
 
blockquote>blockquote {
  background-repeat: repeat;
  background-position: center;
background-color: rgb(var(--dark-gray-monochrome)) !important;
padding:15px;
margin: .7vw !important;
background-image: var(--paper-texture);
}
 
blockquote>blockquote>blockquote {
  background-repeat: repeat;
  background-position: center;
background-color: rgb(var(--light-gray-monochrome)) !important;
padding:15px;
background-image: var(--paper-texture);
}
 
blockquote>blockquote>blockquote>blockquote {
  background-repeat: repeat;
  background-position: center;
background-color: rgb(var(--light-pale-gray-monochrome)) !important;
color: rgb(var(--dark-accent)) !important;
padding:15px;
background-image: var(--paper-texture);
font-family: 'Merienda', cursive !important;
}
 
/* Side Bar*/
 
.close-menu::after {
background-color: rgb(var(--gray-monochrome)) !important;
}
 
#side-bar .heading, #side-bar .side-block>.collapsible-block:nth-child(1) .collapsible-block-folded{
box-shadow: none;
border-image: var(--gold-foil) 6 round;
border-bottom: solid rgb(var(--black-monochrome)) !important
}
 
.side-block div:nth-of-type(1) input.button, .side-block div:nth-of-type(1) input.text{
margin: 5px !important;
border-right: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-bottom: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
}
#side-bar {
box-shadow: 3px 3px 3px  rgba(var(--shadow-accent)) !important;
    background: rgb(var(--white-monochrome)) var(--paper-texture) repeat scroll top center !important;
--sidebar-bg-color: var(--gray-monochrome);
}
 
.side-block{
padding: 1vw;
    background-color: rgb(var(--gray-monochrome)) !important;
    background-image: var(--paper-texture) !important;
border-left: none !important;
border-top: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-right: none !important;
border-bottom: none !important;
box-shadow: 3px 3px 3px  rgba(var(--shadow-accent));
 
}
 
#side-bar div.menu-item{
margin-top: 5px !important;
margin-bottom: 5px !important;
}
 
#side-bar div.menu-item .text, #side-bar div.menu-item a, #side-bar div.menu-item a:visited{
background-color: rgb(var(--dark-gray-monochrome)) !important;
    background-image: var(--paper-texture) !important;
  background-repeat: repeat;
  background-position: center;
border-top: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-right: none !important;
border-left: none !important;
border-bottom: none !important;
box-shadow: 3px 3px 3px rgba(var(--shadow-accent));
margin-top: 5px !important;
}
 
#side-bar div.menu-item input.text{
border-right: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-bottom: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-left: none !important;
border-top: none !important;
box-shadow: inset 3px 3px 3px rgba(var(--shadow-accent));
}
 
/*Page*/
 
.page-source{
font-family: 'Raleway', sans-serif;
}
 
/*table*/
 
table, th, td, tr {
background-image: var(--paper-texture);
background-color: rgb(var(--white-monochrome)) !important;
border-collapse: separate !important;
border-image: var(--gold-foil) 6 round !important;
border-width: 2px !important;
}
 
#page-content div.b-tables table.wiki-content-table td, #page-content table.wiki-content-table td{
background-image: var(--paper-texture) !important;
border-image: var(--gold-foil) 6 round !important;
}
 
#page-content div.b-tables table.wiki-content-table th, #page-content table.wiki-content-table th{
background-image: var(--paper-texture) !important;
border-image: var(--gold-foil) 6 round !important;
border-width: 2px !important;
}
 
/*tabs*/
 
yui-navset yui-navset-top{
border: none !important;
background-image: var(--paper-texture);
background-color: rgb(var(--gray-monochrome)) !important;
}
.yui-navset .yui-content, .yui-navset .yui-navset-top .yui-content{
border-left: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-top: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-right: none !important;
border-bottom: none !important;
box-shadow: 5px 5px 5px rgba(var(--shadow-accent)) !important;
background-image: var(--paper-texture);
background-color: rgb(var(--gray-monochrome)) !important;
}
 
.yui-navset .yui-nav li, .yui-navset .yui-nav li a, .yui-navset .yui-nav li a::before{
border-radius: 0;
}
 
.yui-navset .yui-nav a:before{
 
border-left: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-top: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-right: none !important;
box-shadow: 0px 5px 5px rgba(var(--shadow-accent));
background-image: var(--paper-texture);
background-color: rgb(var(--gray-monochrome)) !important;
}
 
@-webkit-keyframes tab-active {
    0% {
        margin-top: 0;
        margin-right: 0;
        padding-top: 0;
    }
 
    100% {
        margin-top: 0em;
        margin-right: 0;
        padding-top: 0em;
    }
}
@keyframes tab-active {
    0% {
        margin-top: 0;
        margin-right: 0;
        padding-top: 0;
    }
 
    100% {
        margin-top: 0em;
        margin-right: 0;
        padding-top: 0em;
    }
}
 
.code {
  background-repeat: repeat;
  background-position: center;
background-color: rgb(var(--light-pale-gray-monochrome)) !important;
color: rgb(var(--dark-accent)) !important;
padding:15px;
background-image: var(--paper-texture);
border-right: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-bottom: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-left: none !important;
border-top: none !important;
box-shadow: inset 5px 5px 5px rgba(var(--shadow-accent)) !important;
}
 
.code * {
font-family: 'Merienda', cursive !important;
}
 
.hl-var{
color: var(--gray-monochrome);
}
 
.hl-special, .hl-string{
color: var(--dark-gray-monochrome);
}
 
.hl-number{
color: var(--light-gray-monochrome);
}
.hl-reserved{
color: var(--light-gray-monochrome);
}
 
div.page-watch-options a, div.page-watch-options a:visited{
--hover-link-color: var(--dark-accent);
}
 
#content-wrap {
background-color: rgb(var(--white-monochrome)) !important;
background-image: var(--paper-texture) !important;
}
 
.content.modal-body{
color: rgb(var(--black-monochrome));
}
 
body {
background-color: rgb(var(--white-monochrome)) !important;
background-image: var(--paper-texture) !important;
}
#page-content{
font-size: 18px;
}
 
/*Editor*/
#main-content{
--editor-icon-color: var(--dark-accent);
}
 
.page-rate-widget-box {
    background-image: var(--paper-texture) !important;
    background-color:  rgb(var(--gray-monochrome)) !important;
  background-repeat: repeat;
  background-position: center;
border-right: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-bottom: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-left: none !important;
border-top: none !important;
box-shadow: inset 3px 3px 3px rgba(var(--shadow-accent));
}
 
.wd-editor-toolbar-panel{
padding: 10px !important;
}
 
form#edit-page-form .wd-editor-toolbar-panel{
border: none !important;
}
 
form#edit-page-form .wd-editor-toolbar-panel div>ul>li>ul a{
    background-image: var(--paper-texture) !important;
  background-repeat: repeat;
background-color: rgb(var(--gray-monochrome)) !important;
box-shadow: 3px 3px 3px rgba(var(--shadow-accent));
border-left: none !important;
border-top: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-right: none !important;
border-bottom: none !important;
font-family: 'Raleway', sans-serif;
}
 
form#edit-page-form .wd-editor-toolbar-panel a{
    background-image: var(--paper-texture) !important;
  background-repeat: repeat;
background-color: rgb(var(--dark-gray-monochrome)) !important;
box-shadow: 3px 3px 3px rgba(var(--shadow-accent));
border-left: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-top: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-right: none !important;
border-bottom: none !important;
font-family: 'Raleway', sans-serif;
}
 
form#edit-page-form, form#edit-page-form :not(#edit-page-textarea)>tbody>tr{
border: none !important;
font-family: 'Raleway', sans-serif;
}
 
form#edit-page-form #edit-page-textarea{
 
font-family: 'Raleway', sans-serif!important;
}
 
textarea#edit-page-comments{
color: rgb(var(--dark-accent)) !important;
font-family: 'Raleway', sans-serif;
}
textarea:not(:placeholder-shown){
font-family: 'Raleway', sans-serif;
    background-image: var(--paper-texture) !important;
  background-repeat: repeat;
background-color: rgb(var(--light-pale-gray-monochrome));
color: rgb(var(--dark-accent));
box-shadow: inset 3px 3px 3px rgba(var(--shadow-accent)) !important;
border-right: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-bottom: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-radius: 0px;
font-family: 'Merienda', cursive;
}
 
:not(.page-rate-widget-box):not(#search-top-box-form) > .owindow .button-bar a, :not(.page-rate-widget-box):not(#search-top-box-form) > div.buttons input, :not(.page-rate-widget-box):not(#search-top-box-form) > input.button, :not(.page-rate-widget-box):not(#search-top-box-form) > button, :not(.page-rate-widget-box):not(#search-top-box-form) > .button, :not(.page-rate-widget-box):not(#search-top-box-form) > div.buttons input, :not(.page-rate-widget-box):not(#search-top-box-form) > input.button, :not(.page-rate-widget-box):not(#search-top-box-form) > button, :not(.page-rate-widget-box):not(#search-top-box-form) > .btn{
border-radius: 0px;
    background-image: var(--paper-texture) !important;
  background-repeat: repeat;
background-color: rgb(var(--dark-gray-monochrome)) !important;
color: rgb(var(--dark-accent));
box-shadow: 3px 3px 3px rgba(var(--shadow-accent));
border-left: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-top: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
font-family: 'Merienda', cursive;
border-right: none !important;
border-bottom: none !important;
}
 
.wd-editor-toolbar-panel{
border-top: 0px;
border-left: 0px;
border-bottom: 0px;
box-shadow: inset 3px 3px 3px rgba(var(--shadow-accent)) !important;
    background-image: var(--paper-texture) !important;
    background-color: rgb(var(--swatch-menubg-color)) !important;
border-right: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
}
form#edit-page-form table.form:first-of-type td:last-of-type input:not(:placeholder-shown) {
background-color: rgb(var(--dark-gray-monochrome));
background-image: var(--paper-texture) !important;
border-right: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-bottom: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-left: none !important;
border-top: none !important;
border-radius: 0px;
font-family: 'Raleway', sans-serif;
}
 
form#edit-page-form:not(.data-form){
 
background-color: rgb(var(--gray-monochrome));
background-image: var(--paper-texture) !important;
}
 
form#edit-page-form .wd-editor-toolbar-panel a{
color: rgb(var(--dark-accent));
}
 
form#edit-page-form{
border-right: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-bottom: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-left: none !important;
border-top: none !important;
box-shadow: inset 3px 3px 3px rgba(var(--shadow-accent));
}
 
form#edit-page-form .edit-page-bottomtable tr>td:first-of-type>div:first-of-type textarea:not(:placeholder-shown) {
    background-color: rgba(var(--dark-gray-monochrome));
border-right: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-bottom: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-left: none !important;
border-top: none !important;
box-shadow: inset 3px 3px 3px rgba(var(--shadow-accent));
}
 
/*Footer*/
 
.footnotes-footer{
background-image: var(--paper-texture);
    background-color: rgba(var(--gray-monochrome));
border-left: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-top: 0.05em solid rgb(var(--light-pale-gray-monochrome)) !important;
border-right: none !important;
border-bottom: none !important;
box-shadow: 3px 3px 3px rgba(var(--shadow-accent));
 
}
.footnotes-footer a[href*=javascript]:before{
color: rgb(var(--dark-accent));
}
 
#footer{
    --footer-link-hover-color: var(--dark-accent);
}
 
#license-area {
--license-link-hover-color: var(--dark-accent);
}
 
div#footer{
background-image: var(--paper-texture);
background-color: rgb(var(--gray-monochrome));
box-shadow: inset 0px 3px 3px rgba(var(--shadow-accent));
}
 
#license-area {
background-image: var(--paper-texture);
box-shadow: inset 0px 3px 3px rgba(var(--shadow-accent));
 
}
 
/*Listpages more by author*/
.authorname{
color: rgb(var(--black-monochrome)) !important;
}
 
.collection .collapsible-block-unfolded-link {
    border: none;
background-color: rgb(var(--white-monochrome));
    background-image: var(--paper-texture);
}
.collection>.collapsible-block {
    background-image: var(--gold-foil);
    border: none;
    background-color: rgb(var(--black-monochrome));
    text-align: center
}
 
.collection .collapsible-block-unfolded-link a, .collection .collapsible-block-folded a {
    color: rgb(var(--black-monochrome));
}
 
.collection .collapsible-block-folded {
    border: none;
    background-color: rgb(var(--white-monochrome));
    background-image: var(--paper-texture);
}

Footnotes

1. 这里是注释