注意啦
如果你在使用过程中发现了BUG或兼容性问题,欢迎随时私信反馈,以便及时解决代码问题
该版式是AI_Mayca应
Chisaka Tamaku_xs的委托以及为Site-CN-11制作,以熙攘版式为模板修改而来,添加了版头背景动画,并对部分细节进行了优化,已启用防Saving Page模块。
使用方法
若要应用该版式,请将这段代码加入你的页面顶部↓:
[[include :scp-wiki-cn:theme:greyday]]
版式版头的标题与logo默认隐藏,如果只是希望使用无文字的纯背景版头,那么无须添加任何额外代码∠( ᐛ 」∠)_
若要添加自定义的标题与logo,请继续添加并修改如下代码↓:
大标题→
小标题→
logo链接→
[[module css]]
:root {
--header-title: "Site-CN-11";
--header-subtitle: "笼中之鸟,破晓则啸";
--header-img: url("https://scpsandboxcn.wdfiles.com/local--files/collab:site-cn-11/白色透明");
}
[[/module]]
粗体模式
可选选项,如果你想在页面上应用更粗的字体↓
[[include :scp-wiki-cn:theme:greyday boldmod=a]]
示例
喵?1
1 级标题
2 级标题
3 级标题
4 级标题
5 级标题
6 级标题
粗体 | 斜体 | 下划线 | 删除线 | teletype text 上标下标
可通过五个连字符“-----”创建水平分割线。
| 标题 | 标题 | 标题 | 标题 | 标题 | 标题 |
|---|---|---|---|---|---|
| 子内容 | 子内容 | 子内容 | 子内容 | 子内容 | 子内容 |
| 子内容 | 长内容 | ||||
| 子内容 | 子内容 | 子内容 | 子内容 | 子内容 | 子内容 |
可用的DIV块
警告框:
这里是一个警告框
注意!你看见的这段警告文字位于这个警告div块里
代码↓:
[[div class="warningquote"]]
[[div]]
**这里是一个警告框**
注意!你看见的下面这段警告文字位于这个警告div块里
[[/div]]
[[/div]]
黑色方框:
每个人都不得不面对这些问题。 在面对这种问题时, 这是一个方形黑底的普通div块,到底应该如何实现。 生活中,若这是一个方形黑底的普通div块出现了,我们就不得不考虑它出现了的事实。 我们一般认为,抓住了问题的关键,其他一切则会迎刃而解。 乌申斯基说过一句富有哲理的话,学习是劳动,是充满思想的劳动。带着这句话,我们还要更加慎重的审视这个问题。我们都知道,只要有意义,那么就必须慎重考虑。 这是一个方形黑底的普通div块因何而发生? 这是一个方形黑底的普通div块,发生了会如何,不发生又会如何。
代码↓:
[[div class="blockquote"]]
每……略……何。
[[/div]]
带黑色题头的方框:
这是一个标题
而这里是
一个非常懒惰的div一号,代号是F07B
可以塞入很多文本
以及其他有用的东西
这是一个标题
而这里是
一个非常任性的div二号,代号是F06A
不想被塞入任何东西
这是一个标题
而这里是
一个非常可爱的div三号,代号是F069
只会喵喵叫~
代码↓:
[[div class="blockplusquote plus-F07B"]]
[[div]]
这是一个标题
[[/div]]
而这里是
一个非常懒惰的div一号,代号是F07B
可以塞入很多文本
以及其他有用的东西
[[/div]]
[[div class="blockplusquote plus-F06A"]]
[[div]]
这是一个标题
[[/div]]
而这里是
一个非常任性的div二号,代号是F06A
不想被塞入任何东西
[[/div]]
[[div class="blockplusquote plus-F069"]]
[[div]]
这是一个标题
[[/div]]
而这里是
一个非常可爱的div三号,代号是F069
只会喵喵叫~
[[/div]]
如果你需要更多小图标….
F03E
F0E0
F005
F3C5
F057
F5AD
F0C6
F15B
F05A
E09A
F2BD
F304
F008
F06E
F070
F07C
F121
F0C1
F481
那么恭喜你找对地方了。版式内含二十三个可随时使用的小图标,若你想进一步了解并使用Font Awesome,请点击此处。
使用这些附加的图标并不困难,将图标对应的Unicode码(例如F069)填入 plus- 之后↓
[[div class="blockplusquote plus-图标的Unicode码"]]
[[div]]
标题
[[/div]]
正文
[[/div]]
再把它放在你需要用的地方,大功告成啦
页面标题与一级标题字体为 FlyFlowerSong 飞花
正文字体为 Noto Sans SC
[[module css]] /* ------------------------------------------------------------ Greyday [2023 Wikidot Theme] By AI_Mayca Based on Zattou by sendoh-oroka Created for the SCP Foundation Background image licensed under CC-BY-SA 3.0 ------------------------------------------------------------ */ @font-face { font-family: 'FlyFlowerSong'; src: url("https://scpsandboxcn.wikidot.com/local--files/collab:mayca/FlyFlowerSong.woff2") format('woff2'); } @import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"); /* --基本样式↓-- */ a { color: #DFDFCF; text-decoration: none; } a:hover { color: #A1A191; text-decoration: none; } a:visited { color: #A1A191; text-decoration: none; } #main-content a { transition: .3s; } h1 { color: #CAD1D1; font-family: 'FlyFlowerSong', serif; } body { color: #CAD1D1; background: #161615F5; font-weight: 100; } html { scroll-behavior: smooth; } #skrollr-body { width: 100%; overflow: hidden;/*解决移动端右侧溢出问题*/ } div#container-wrap { background: none; } div#container-wrap::before { content: ""; display: block; width: 100%; height: 100%; background: url("http://scpsandboxcn.wikidot.com/local--files/collab:mayca/灰日_背景") no-repeat 50% 50%/cover; -webkit-filter: blur(15px) opacity(0.8) brightness(0.8); filter: blur(15px) opacity(0.8) brightness(0.8); position: fixed; top: 0; z-index: -1; } /* --基本样式↑-- */ /* --版头样式↓-- */ #header { height: 150px; background: none; } #header::after { -webkit-filter: blur(5px) brightness(0); filter: blur(5px) brightness(0); z-index: -1; } #header::after, #header::before { content: ""; display: block; width: 100px; height: 100px; background-image: var(--header-img); background-repeat: no-repeat; background-position: 50% 50%; background-size: 100% 100%; opacity: .9; position: absolute; top: 40px; left: 10px; } #top-bar { top: 150px; } #header h1 a::before { background: none; } #header h1 a span { visibility: hidden; } #header h2 span { color: transparent; text-shadow: 0px 0px 0px; } #header h2 span::before { background: none; } #header h1 a::before { content: var(--header-title); } #header h2::before { content: var(--header-subtitle); color: #DFDFCF; } div#search-top-box { width: 100%; top: 18.5px; right: 70px; } div#search-top-box form { display: flex; justify-content: flex-end; } div#search-top-box form input[type="text"], div#search-top-box form input[type="text"]:hover { display: inline-block; width: 8rem; height: 1.1rem; background-color: transparent; border-color: transparent; outline: none; transition: all .5s; } div#search-top-box form input[type="text"]:focus, div#search-top-box form input[type="text"]:hover { background-color: rgba(0, 0, 0, .3); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); } /*针对Safari的CSS Hack*/ _::-webkit-full-page-media, _:future, :root div#search-top-box form input[type="text"] { font-size: 16px; } div#search-top-box form input[type="text"]:not(:focus), div#search-top-box form input[type="text"]:not(:focus):not(:hover) { display: inline-block; width: 22px; height: 22px; color: transparent; background: rgba(0, 0, 0, .5) url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22%23ddd%22%20d%3D%22M505%20442.7L405.3%20343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3%2044-79.7%2044-128C416%2093.1%20322.9%200%20208%200S0%2093.1%200%20208s93.1%20208%20208%20208c48.3%200%2092.7-16.4%20128-44v16.3c0%206.4%202.5%2012.5%207%2017l99.7%2099.7c9.4%209.4%2024.6%209.4%2033.9%200l28.3-28.3c9.4-9.4%209.4-24.6.1-34zM208%20336c-70.7%200-128-57.2-128-128%200-70.7%2057.2-128%20128-128%2070.7%200%20128%2057.2%20128%20128%200%2070.7-57.2%20128-128%20128z%22%2F%3E%3C%2Fsvg%3E") no-repeat center/55%; border-radius: 50px; box-sizing: border-box; box-shadow: none; cursor: pointer; } div#search-top-box form input[type="submit"] { display: none; } #search-top-box-input { border: solid 1px transparent; border-radius: 2px; } #login-status { display: flex; flex-direction: column; align-content: space-around; font-size: 0; top: 0; } #login-status .printuser { width: 28px; background-color: none; padding: 0; margin: 0; position: absolute; top: 13px; right: 0px; } #login-status .printuser img.small { background: none !important; margin: 0; width: 28px; height: 28px; padding: 0; border-radius: 100px; box-shadow: 0 0 3px #3F3F3F; } #login-status [id] { font-size: .72rem; } #login-status>a[href="javascript:;"] { width: 22px; height: 22px; background: none; border: none; font-size: 0; font-weight: bold; text-align: center; text-decoration: none; padding: 0; margin: 0; position: absolute; top: 18.5px; right: 34px; } #login-status>a[href="javascript:;"]::before { display: inline-block; width: 22px; height: 22px; background-color: rgba(0, 0, 0, .5); border-radius: 50px; font-size: 15px; font-family: FontAwesome; text-rendering: auto; line-height: 14px; -webkit-font-smoothing: antialiased;/*chrome、safari字体抗锯齿*/ -moz-osx-font-smoothing: grayscale;/*firefox字体抗锯齿*/ box-sizing: border-box; transform: translate(0, 0); padding: 0; padding-top: 4.2px; margin: 0; } /*针对Safari的CSS Hack*/ _::-webkit-full-page-media, _:future, :root #login-status>a[href="javascript:;"]::before { padding-top: calc(4.2px + .03em); padding-left: .1em; } #login-status #account-topbutton::before { content: "\F013"; color: var(--base-color); } #login-status a.login-status-sign-in { right: 33px; } #login-status .login-status-sign-in::before { content: "\F13E"; color: var(--base-color); } #login-status a.login-status-create-account { right: 5px; } #login-status .login-status-create-account::before { content: "\F067"; color: var(--base-color); } #login-status #my-account { display: none; } #account-topbutton:focus+#account-options, #account-topbutton:focus-within+#account-options, #account-topbutton:active+#account-options, #account-topbutton+#account-options:focus, #account-topbutton+#account-options:focus-within, #account-topbutton+#account-options:active { opacity: 1; pointer-events: auto; transform: translateX(0); -webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; transition: all .5s; } #account-options { display: block; background-color: #16161570; border: none; border-radius: 3px; opacity: 0; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); pointer-events: none; transform: translateX(50%); -webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; transition: all .5s; padding: 5px; top: 50px; } /*针对Safari的CSS Hack*/ _::-webkit-full-page-media, _:future, :root #account-options { display: none; opacity: 1; pointer-events: auto; transform: translateX(0); } #account-options ul { display: flex; flex-wrap: wrap; justify-content: space-around; } #account-options ul>li { flex-grow: 1; width: 40%; text-align: center; } #account-options ul>li a { transition: all .25s ease-in-out; } #account-options ul>li a:hover { color: #A1A191; background-color: #16161570; border-radius: 3px; font-weight: 300; text-decoration: none; } #login-status ul a { color: #DFDFCF; } /* --版头样式↑-- */ /* --版头动画↓-- */ div#extra-div-1 { width: 100%; height: 150px; background: url("http://scpsandboxcn.wikidot.com/local--files/collab:mayca/灰日_中下") no-repeat 0 50%/100% 150px; overflow: hidden; position: absolute; top: 0; } div#extra-div-1::before, div#extra-div-1::after { content: ""; display: block; width: 200%; height: 150px; position: absolute; top: 0; } div#extra-div-1::before { background: url("http://scpsandboxcn.wikidot.com/local--files/collab:mayca/灰日_上") repeat-x 0 50%/50% 150px; animation: moveBgAnim 120s linear infinite; z-index: -1; } div#extra-div-1::after { background: url("http://scpsandboxcn.wikidot.com/local--files/collab:mayca/灰日_沙尘") repeat-x 0 50%/50% 150px; animation: windBgAnim 8s linear infinite; z-index: 1; } @keyframes moveBgAnim { 0% { transform: translateX(-0%) } 100% { transform: translateX(-50%) } } @keyframes windBgAnim { 0% { transform: translateX(-0%); opacity: 1 } 30% { opacity: 1 } 55% { opacity: 0 } 70% { opacity: 1 } 100% { transform: translateX(-50%); opacity: 1 } } /* --版头动画↑-- */ /* --版头响应式布局↓-- */ @media (max-width: 479px) { #header { background-position: 0 5em; background-size: 55px 55px; } #header::after, #header::before { width: 55px; height: 55px; top: 5em; left: 0; } } @media (min-width: 480px) and (max-width: 580px) { #header { background-position: 0.5em 4.5em; background-size: 66px 66px; } #header::after, #header::before { width: 66px; height: 66px; top: 4.5em; left: 0.5em; } } @media (min-width: 581px) and (max-width: 767px) { #header { background-size: 77px 77px; } #header::after, #header::before { width: 77px; height: 77px; top: 4em; left: 1em; } } @media (min-width: 768px) and (max-width: 979px) { #header { background-position: 1em 3.5em; background-size: 88px 88px; } #header::after, #header::before { width: 88px; height: 88px; top: 3.5em; left: 1em; } } @media (max-width: 800px) { div#extra-div-1 { width: 800px; height: 150px; left: calc((100% - 800px)/2); } } @media (min-width: 801px) and (max-width: 999px) { div#extra-div-1 { width: 100%; height: 150px; } } @media (min-width: 1000px) { div#extra-div-1 { background-size: 100% 15vw; } div#extra-div-1::before, div#extra-div-1::after { background-size: 50% 15vw; } } @media (min-width: 1200px) { #header { height: calc(15vw - 30px); } #top-bar { top: calc(15vw - 30px); } div#extra-div-1 { height: calc(15vw - 30px); } div#extra-div-1::before, div#extra-div-1::after { height: calc(15vw - 30px); } div#extra-div-2 { top: calc(15vw - 30px); } } /* --版头响应式布局↑-- */ /* --顶栏样式↓-- */ #extra-div-2 { width: 100%; height: 21px; background-color: #0D0D0CE0; position: absolute; top: 150px; } #top-bar a { color: #CAD1D1; } #top-bar ul li ul { border: solid 1px #0D0D0C; border-top: none; border-radius: 3px; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); overflow: hidden; } #top-bar ul li.sfhover a, #top-bar ul li:hover a { color: #161615; background: #CAD1D180 !important; border-left: solid 1px #0D0D0C; border-right: solid 1px #0D0D0C; font-weight: 300; } #top-bar ul li ul li { background-color: transparent; transition: background-color .3s; } #top-bar ul li ul li:hover { background-color: #CAD1D180; } #top-bar ul li ul li a { background: #16161530 !important; border-top: none !important; transition: color background-color .3s; padding: .5em; } #top-bar ul li ul li:hover a { color: #CAD1D1; background-color: #161615D0 !important; font-weight: 100; } #top-bar .open-menu a { color: #CAD1D1E0; background: transparent; border: solid 5px #CAD1D1E0; border-radius: 2px; box-shadow: 0 0 3px #43414180, 0 0 3px #43414180 inset; text-shadow: 0 0 3px #43414180; } #top-bar .open-menu a[href="#side-bar"]:hover { box-shadow: 0 0 10px 1px #CAD1D1E0, 0 0 10px 1px #CAD1D1E0 inset, 0 0 3px #43414180, 0 0 3px #43414180 inset; } /* --顶栏样式↑-- */ /* --评分栏样式↓-- */ div.page-rate-widget-box { box-shadow: none; border-bottom: 2px solid #CAD1D1; border-radius: 0; } .creditRate .rateBox { display: inline-flex; border-bottom: 2px solid #CAD1D1; } .creditRate .rateBox div.page-rate-widget-box { border-bottom: none; } .page-rate-widget-box .rate-points { background-color: transparent !important; border: none; border-radius: 0; color: #CAD1D1; } .page-rate-widget-box .rateup, .page-rate-widget-box .ratedown { background-color: transparent; border: none; } .page-rate-widget-box .rateup a, .page-rate-widget-box .ratedown a { color: #CAD1D1; } .page-rate-widget-box .rateup a:hover, .page-rate-widget-box .ratedown a:hover { color: #CAD1D180; background: transparent; } .page-rate-widget-box .cancel { color: #CAD1D1; background-color: transparent; border: none; border-radius: 0; } .page-rate-widget-box .cancel a { color: #CAD1D1; } .page-rate-widget-box .cancel a:hover { color: #CAD1D180; background: transparent; } #page-content .rate-box-with-credit-button { background-color: transparent; border-style: none; border-radius: 0; box-shadow: none; } #page-content .rate-box-with-credit-button .creditButton { background-color: transparent; border: none; } #page-content .rate-box-with-credit-button .creditButton p a.fa.fa-info { color: #CAD1D1; border-left-color: #CAD1D1; } #page-content .rate-box-with-credit-button .creditButton p a.fa.fa-info:hover { color: #CAD1D180; } #page-content .modalbox { background: none; background-color: #161615B1; border: none; border-radius: 5px; box-shadow: none; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); } #page-content #u-credit-otherwise .modalbox { background: none; } #page-content .modalbox h2 { color: #CAD1D1; } .modalbox>.modalbox-title>h2>span { font-family: 'FlyFlowerSong'; } /*迷之代码,不是很清楚原代码里这个是干嘛用的,就不乱动了↓*/ #page-content .creditButtonStandalone p a { background-color: transparent; border-bottom: 2px solid #161615; border-radius: 0; color: #161615; box-shadow: none; } #page-content .creditButtonStandalone p a:hover { color: #161615EE; } /*迷之代码↑*/ .close-credits { -webkit-filter: brightness(0) invert(1); filter: brightness(0) invert(1); } .credit-back { -webkit-filter: brightness(0) invert(1); filter: brightness(0) invert(1); } /* --评分栏样式↑-- */ /* --侧边栏样式↓-- */ @media (max-width: 767px) { #content-wrap #side-bar { background-color: #16161590; border: 0 none; } #side-bar:target .close-menu { background: #16161580 1px 1px repeat; } #side-bar:target .close-menu::after { content: ""; display: block; width: 19em; height: 100%; animation: backdropFilterAnim .3s linear 0.6s; animation-fill-mode: forwards; position: absolute; top: 0; left: 0; z-index: -1; } @keyframes backdropFilterAnim { 0% { -webkit-backdrop-filter: blur(0px); backdrop-filter: blur(0px); } 100% { -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); } } } #side-bar .side-block { color: #161615; background-color: #CAD1D190 !important; border: none; border-radius: 2px; box-shadow: 0px 0px 4px #161615; position: relative; } #side-bar .side-block a { color: #161615; background: -webkit-linear-gradient(to left, #2B2B2B, #180614, #000B00); background: linear-gradient(to left, #2B2B2B, #180614, #000B00); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } #side-bar .side-block hr { height: 1.5px; background-color: #161615; margin: 1em 1px; } #side-bar .heading { color: #161615; background: -webkit-linear-gradient(to left, #2b2b2b, #180614, #000b00); background: linear-gradient(to left, #2b2b2b, #180614, #000b00); border-width: 1.5px; border-color: transparent; font-size: 1em; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } #side-bar div.menu-item > img { -webkit-filter: brightness(0); filter: brightness(0); } #side-bar .collapsible-block-folded { -webkit-filter: brightness(0); filter: brightness(0); } #side-bar .collapsible-block-unfolded-link { border-width: 1.5px; border-color: #161615; padding-bottom: 0.5em; margin-bottom: 0.5em; } #side-bar a.collapsible-block-link { font-size: 1em !important; } #side-bar::-webkit-scrollbar { width: 10px; } /* --侧边栏样式↑-- */ /* --标题样式↓-- */ #page-title { color: #CAD1D1; font-family: 'FlyFlowerSong', serif; font-size: 220%; font-weight: 900; letter-spacing: 0.1em; border-color: #CAD1D1; border-bottom: solid 1.5px #CAD1D1; transform: scale(1, 1); transition: 0.5s; margin-top: -11px; } /* --标题样式↑-- */ /* --图片块样式↓-- */ #page-content .scp-image-block { border-color: #161615; box-shadow: none; } #page-content .scp-image-block .scp-image-caption { color: #161615; background-color: #CAD1D190; border-color: #161615; } #page-content .scp-image-block .scp-image-caption a { color: #161615; } #page-content .scp-image-block .scp-image-caption a:hover { color: #16161590; } /* --图片块样式↑-- */ /* --表格样式↓-- */ table.wiki-content-table th { color: #CAD1D190; background-color: #49494880; border-color: transparent; } table.wiki-content-table td { color: #000; background-color: #CAD1D180; border-color: #00000070; font-weight: 300; } /* --表格样式↑-- */ /* --分割线样式↓-- */ hr { height: 1.5px; background-color: #CAD1D1; } /* --分割线样式↑-- */ /* --代码块样式↓-- */ .code { color: #CAD1D1; background-color: #49494880; border: solid 1px #161615E0; border-radius: 2px; } .hl-brackets, .hl-code, .hl-identifier { color: #CAD1D1; } /* --代码块样式↑-- */ /* --TAB样式↓-- */ .yui-navset, .yui-navset .yui-nav, .yui-navset .yui-nav li a, .yui-navset .yui-nav li a em { border: 0 none; } .yui-navset .yui-nav { background: transparent; white-space: nowrap; overflow-x: scroll; } .yui-navset .yui-nav::-webkit-scrollbar { display: none; } .yui-navset .yui-nav li, .yui-navset .yui-nav li.selected { border-radius: 2px; overflow: hidden; cursor: auto; padding: 0; margin: 0; margin-right: -1em; } .yui-navset .yui-nav li a, .yui-navset .yui-nav li a:hover, .yui-navset .yui-nav li a:focus { background: #49494880; padding: .2em 1.2em; } .yui-navset .yui-nav li:nth-of-type(1) a, .yui-navset .yui-nav li:nth-of-type(1) a:hover, .yui-navset .yui-nav li:nth-of-type(1) a:focus { -webkit-clip-path: polygon(0 0, calc(100% - 1.2em) 0, 100% 100%, 0 100%); clip-path: polygon(0 0, calc(100% - 1.2em) 0, 100% 100%, 0 100%); padding-left: .6em; } .yui-navset .yui-nav li:not(:nth-of-type(1)) a, .yui-navset .yui-nav li:not(:nth-of-type(1)) a:hover, .yui-navset .yui-nav li:not(:nth-of-type(1)) a:focus { -webkit-clip-path: polygon(0 0, calc(100% - 1.2em) 0, 100% 100%, 1.2em 100%); clip-path: polygon(0 0, calc(100% - 1.2em) 0, 100% 100%, 1.2em 100%); } .yui-navset .yui-nav li.selected a, .yui-navset .yui-nav li.selected a:hover, .yui-navset .yui-nav li.selected a:focus { background: #CAD1D180; } .yui-navset .yui-nav li a em { color: #CAD1D1; } .yui-navset .yui-nav li.selected a em { color: #161615; font-weight: 500; padding: 0.25em 0.75em; } .yui-navset .yui-content { background: #49494880; border: none; border-radius: 2px; margin-top: .2em; } /* --TAB样式↑-- */ /* --用户信息↓-- */ div.owindow { color: #CAD1D1; background: #161615D0; border: solid 2px transparent; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); } .owindow .title { background-color: #161615E0; } .owindow .title.modal-header { color: #CAD1D1; background: #161615E0; border-bottom: solid 1px transparent; } div.owindow>div.content>img { background: transparent !important; } div.owindow>div.content>h1 { color: #DFDFDF; } .owindow .button-bar a { color: #161615; background: #CAD1D1; transition: .3s; } .owindow .button-bar a:hover { background: #CAD1D1D0; } /* --用户信息↑-- */ /* --其他样式↓-- */ div.blockquote { color: #CAD1D1; background: #49494880; border: solid 1px #161615E0; border-radius: 2px; font-weight: 300; } div#toc { color: #161615; background: #CAD1D180; border: solid 1px #161615E0; border-radius: 2px; font-weight: 300; } div#toc a { color: #161615; } div#toc a:hover { color: #161615E0; } .hovertip { width: 20em; color: #161615; background: #CAD1D180 !important; border: 2px solid transparent !important; border-radius: 2px; font-weight: 300; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); animation: hoverfade .5s ease-in-out both; padding: .2em .5em; z-index: 100; } @keyframes hoverfade { 0% { opacity: 0 } 100% { opacity: 1 } } .hovertip .f-heading { color: #161615; } blockquote { border: 1.5px dashed #333; background-color: #f4f4f41a; } #footer { color: #CAD1D1; background: #49494880; padding: 8px 3px; } #license-area { color: #CAD1D1; background: #16161590; border-top: solid 1.5px #CAD1D180; } .odialog-shader { background-color: #161615; filter: alpha(opacity=80); opacity: .3; } ::-webkit-scrollbar { border: none; } ::-moz-selection { color: #FFF8; background-color: #0008; } ::selection { color: #FFF8; background-color: #0008; } input:focus, textarea:focus { outline: none !important; } #lock-info { color: #CAD1D1; background-color: transparent; border: solid 1px transparent; } .inline-diff del { background-color: #FCC8; } .inline-diff del::before { color: #FCC8; } .inline-diff ins { background-color: #DDF8; } .inline-diff ins::before { color: #DDF8; } .inline-diff ins:first-of-type::before, .inline-diff del:first-of-type::before, .inline-diff br + ins::before, .inline-diff br + del::before { left: 1.4em; } @media (max-width: 766px) { .inline-diff ins:first-of-type::before, .inline-diff del:first-of-type::before, .inline-diff br + ins::before, .inline-diff br + del::before { left: .5em; } } /* --其他样式↑-- */ /* --Mercuresphere的防saving page模块↓-- */ body[class="wait"] #odialog-shader-iframe, body[class="wait"] #odialog-shader { display: none !important; } #odialog-container { position: fixed !important; } body[class="wait"] #odialog-container { z-index: -1; } body[class="wait"] #odialog-container #owindow-1 { display: none !important; } body[class="wait"] a[name="page-top"][target]+div #main-content #action-area div#lock-info { background-color: rgb(var(--dark-accent)); border: 1px solid rgb(var(--bright-accent)); } div#lock-info { font-size: 0 !important; margin: .8rem 0 .8rem 1rem !important; padding: 0.4rem .8rem !important; } div#lock-info::before { content: '您握有一个独占的15 分钟锁定,这将会阻止其他人编辑您正在作业的页面。\A这个锁定将在闲置 '; display: inline; font-size: .82rem; white-space: pre-wrap; } div#lock-info>strong { font-size: .82rem; } div#lock-info>br { display: none; } div#lock-info::after { content: ' 秒后失效。'; display: inline; font-size: .82rem; } body[class="wait"] a[name="page-top"][target]+div #main-content #action-area div#lock-info::before { content: '保存页面中……\A若此提示已经显示了很长时间,建议将编辑框中的内容复制到剪切板然后刷新本页重新编辑。'; display: inline; font-size: .82rem; color: rgb(var(--bright-accent)); white-space: pre-wrap; } body[class="wait"] a[name="page-top"][target]+div #main-content #action-area div#lock-info::after { font-size: 0; } body[class="wait"] a[name="page-top"][target]+div #main-content #action-area div#lock-info>strong { font-size: 0; } body[class="wait"] a[name="page-top"][target]+div #main-content #action-area div#lock-info::after { font-size: 0; } /* --防saving page模块↑-- */ /* --可选边框↓-- */ div.warningquote { display: flex; width: 100%; justify-content: center; align-items: center; } div.warningquote>div { min-width: 350px; min-height: 60px; color: #161615; background: #9A500FD0; font-weight: 400; text-align: left; border-radius: 2px; padding-left: 60px; padding-right: 10px; position: relative; } @media (max-width: 620px) { div.warningquote>div { min-width: auto; width: 100%; } } div.warningquote>div::before { content: ""; display: block; width: 40px; height: 40px; background: url("data:image/svg+xml;charset=utf-8;base64,PHN2ZyB2ZXJzaW9uPScxLjEnIHhtbG5zPSdodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZycgeG1sbnM6eGxpbms9J2h0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsnIHg9JzBweCcgeT0nMHB4JyB2aWV3Qm94PScwIDAgNTAwIDUwMCcgc3R5bGU9J2VuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNTAwIDUwMDsnIHhtbDpzcGFjZT0ncHJlc2VydmUnPjxzdHlsZSB0eXBlPSd0ZXh0L2Nzcyc+IC5zdDB7ZmlsbDojMTYxNjE1O30gPC9zdHlsZT48ZyBpZD0n5Zu+5bGCXzEnPjwvZz48ZyBpZD0n5Zu+5bGCXzInPjxnPjxwYXRoIGQ9J00zNzUuMTQsNTguNTdDMzcyLjMyLDUzLjg2LDM2NS41LDUwLDM2MCw1MEgxNDBjLTUuNSwwLTEyLjMyLDMuODYtMTUuMTQsOC41N0wxNS4xNCwyNDEuNDMgYy0yLjgzLDQuNzItMi44MywxMi40MywwLDE3LjE1bDEwOS43MSwxODIuODVjMi44Myw0LjcyLDkuNjQsOC41NywxNS4xNCw4LjU3aDIyMGM1LjUsMCwxMi4zMi0zLjg2LDE1LjE0LTguNTdsMTA5LjcxLTE4Mi44NSBjMi44My00LjcyLDIuODMtMTIuNDMsMC0xNy4xNUwzNzUuMTQsNTguNTd6IE0yNzAsMzcwYzAsNS41LTQuNSwxMC0xMCwxMGgtMjBjLTUuNSwwLTEwLTQuNS0xMC0xMHYtMjBjMC01LjUsNC41LTEwLDEwLTEwaDIwIGM1LjUsMCwxMCw0LjUsMTAsMTBWMzcweiBNMjcwLjI1LDMxMGMtMC4xNCw1LjUtNC43NSwxMC0xMC4yNSwxMGgtMjBjLTUuNSwwLTEwLjExLTQuNS0xMC4yNS0xMEwyMjUuMjUsMTMwIGMtMC4xNC01LjUsNC4yNS0xMCw5Ljc1LTEwaDMwYzUuNSwwLDkuODksNC41LDkuNzUsMTBMMjcwLjI1LDMxMHonLz48L2c+PC9nPjwvc3ZnPg==") no-repeat center/95%; opacity: .9; position: absolute; top: calc(50% - 20px); left: 10px; } div.warningquote>div strong { font-size: 125%; font-weight: 900; } div.blockplusquote { max-width: 100%; color: #CAD1D1; background: #49494880; border-radius: 2px; box-shadow: 0 0 5px 1px #161615; font-weight: 300; overflow: hidden; padding: 1.75em .5em .5em 2em; margin: 1em 3em; position: relative; } div.blockplusquote>div:nth-of-type(1) { width: 100%; background: #161615D0; font-weight: 900; box-sizing: border-box; padding: .25em .5em .25em 2em; position: absolute; top: 0; left: 0; } div.blockplusquote>div:nth-of-type(1) p { line-height: 0; } div.blockplusquote>div:nth-of-type(1) p::before { display: block; width: 1em; height: 1em; font-family: FontAwesome; font-weight: 100; text-align: center; position: absolute; top: 1.25em; left: .5em; } div.plus-F07B>div:nth-of-type(1) p::before { content: "\F07B"; } div.plus-F06A>div:nth-of-type(1) p::before { content: "\F06A"; } div.plus-F069>div:nth-of-type(1) p::before { content: "\F069"; } div.plus-F03E>div:nth-of-type(1) p::before { content: "\F03E"; } div.plus-F0E0>div:nth-of-type(1) p::before { content: "\F0E0"; } div.plus-F005>div:nth-of-type(1) p::before { content: "\F005"; } div.plus-F3C5>div:nth-of-type(1) p::before { content: "\F3C5"; } div.plus-F057>div:nth-of-type(1) p::before { content: "\F057"; } div.plus-F075>div:nth-of-type(1) p::before { content: "\F075"; } div.plus-F5AD>div:nth-of-type(1) p::before { content: "\F5AD"; } div.plus-F0C6>div:nth-of-type(1) p::before { content: "\F0C6"; } div.plus-F15B>div:nth-of-type(1) p::before { content: "\F15B"; } div.plus-F05A>div:nth-of-type(1) p::before { content: "\F05A"; } div.plus-E09A>div:nth-of-type(1) p::before { content: "\E09A"; } div.plus-F2BD>div:nth-of-type(1) p::before { content: "\F2BD"; } div.plus-F304>div:nth-of-type(1) p::before { content: "\F304"; } div.plus-F008>div:nth-of-type(1) p::before { content: "\F008"; } div.plus-F06E>div:nth-of-type(1) p::before { content: "\F06E"; } div.plus-F070>div:nth-of-type(1) p::before { content: "\F070"; } div.plus-F07C>div:nth-of-type(1) p::before { content: "\F07C"; } div.plus-F121>div:nth-of-type(1) p::before { content: "\F121"; } div.plus-F0C1>div:nth-of-type(1) p::before { content: "\F0C1"; } div.plus-F481>div:nth-of-type(1) p::before { content: "\F481"; } /* --可选边框↑-- */ /* --分级装饰栏组件兼容↓-- */ div.cn.cdver2 { -webkit-filter: invert(1) opacity(0.9); filter: invert(1) opacity(0.9); } /* --分级装饰栏组件兼容↑-- */ [[/module]]
该版式是1100011据其个人使用习惯与美学要求制作,以灰日版式为模板修改而来,对部分细节进行了优化,已启用防Saving Page模块。
使用方法
若要应用该版式,请将这段代码加入你的页面顶部↓:
[[include :1100011:theme:ashes]]
若要添加自定义的标题与logo,请继续添加并修改如下代码↓:
大标题→
小标题→
logo链接→
底图链接→
背景图片→
[[module css]]
:root {
--header-title: "SCP基金会";
--header-subtitle: "控制,收容,保护";
--header-img: url("logo链接");
--bottom-img: url("图片链接");
--background-img: url("图片链接");
}
[[/module]]
可选项
沙盒模式,可以在页面右下角显示页面工具↓
[[include :1100011:theme:ashes sandboxmod=a]]
顾名思义,去除页面标题↓
[[include :1100011:theme:ashes notitle=a]]
页面元素
基础元素
2024年4月12日
代码↓:
[[div class="blockquote"]]
如是。
[[/div]]
可通过四至六个连字符“----”、“-----”或“------”2创建水平分割线。若它未被放在其他部件(诸如引用块)中,则会左右延伸贯穿页面。
标题可通过在一行字起始处输入 1 至 6 个加号“+”来创建。
1 级标题
2 级标题
3 级标题
4 级标题
5 级标题
6 级标题
样式化表格
| 这是 | 表格 |
|---|---|
| 你应该老早 | 就知道怎么 |
| 做这个了吧 | |
| 这是 | 加宽表格 |
|---|---|
| 把表格放进 | [[div class="table wide"]] |
| 来做这个 | |
| 这是 | 三线表 |
|---|---|
| 把表格放进 | [[div class="table three-lines"]] |
| 来做这个 | |
高级信息方法论(AIM)
项目编号:SCP-XXXX
等级-
收容等级:THAUMIEL
扰动等级:DARK
负责站点
Site-0
站点主管
Dr 主管
首席研究员
Dr 博士
指派特遣队
Alpha-1
项目编号:SCP-XXXX
等级-
收容等级:
THAUMIEL
扰动等级:
DARK
负责站点
Site-0
站点主管
Dr 主管
首席研究员
Dr 博士
指派特遣队
Alpha-1
源代码:
[[include :scp-wiki-cn:component:advanced-information-methodology
|lang=cn
|XXXX=XXXX
|lv=1
|cc=THAUMIEL
|dc=DARK
|site=Site-0
|dir=Dr 主管
|head=Dr 博士
|mtf=Alpha-1
]]
« 这里是你的链接
| 一些文本 |
这里是另一个链接 »
[[footnoteblock]]






F075