版式：涂鸦
涂鸦版式与GraffitiLogo由 GaplouelPew 制作，此为版头背景图源。
如果想要在你的页面上使用这个主题，请将如下文本放置其中：
[[include :backrooms-wiki-cn:theme:graffiti]]
版式示例
这是GraffitiLogo，充满色彩，五颜六色（哪有这么多颜色！）
可以使用五个连字符"-----" 创建水平线，如果未将其放置在任何内容（例如引用块）中，则可以扩展到整个页面。分隔本文档各部分的行是水平线。
可以通过在行首加上1-6个之间的"+"字符来创建标题。
滋滋，滋滋，这里充满了喷罐的声音。
别打扰我。
这是一个长分页，它能容纳很多字符。
这是一个长分页，它能容纳很多字符。
这是一个长分页，它能容纳很多字符。
这是一个长分页，它能容纳很多字符。
这是一个长分页，它能容纳很多字符。
这是一个长分页，它能容纳很多字符。
这是一个长分页，它能容纳很多字符。
这是一个长分页，它能容纳很多字符。
这是一个长分页，它能容纳很多字符。
这是一个长分页，它能容纳很多字符。
这是一个长分页，它能容纳很多字符。
这是一个长分页，它能容纳很多字符。
嗨嗨！
这是一个引用块，在一行字的起始处加上“> ”来创建。
更多文字
一条分割线
嵌套块引用1
套娃
继续套
套！！！
| 这是一个 | 表格 |
|---|---|
| 你应该早就 | 知道怎么 |
| 制作它 | 了吧 |
标题与版头字体为Noto Sans SC。
正文字体为Noto Sans。
等宽字体为Noto Serif SC。
脚1
这段文本
放在这里
你们就能
看到不同
格式以及
其它东西
看起来是
怎么运作
包括那些不存在
以及存在的链接！
标题示例
[[div class="titleblock"]]
[[span class="titlebox"]]标题示例[[/span]]
[[/div]]
标题示例
[[div class="light-titleblock"]]
[[span class="light-titlebox"]]标题示例[[/span]]
[[/div]]
[[div class="styled-quote"]]
[[/div]]
[[div class="dark-styled-quote";]]
[[div class="dark-styled-quote"]]
[[/div]]
[[/div]][[div class="lightblock"]]
[[/div]]
[[div class="darkblock"]]
[[/div]]
[[div class="light-logoblock"]]
[[/div]]
[[div class="logoblock"]]
[[/div]]
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@900&display=swap');
:root {
--logo-image: url("");
--header-title: "";
--header-subtitle: "我用涂鸦丰富这黑白的世界";
--body-font: 'Noto Sans', sans-serif;
--header-font: 'Noto Sans SC';
--title-font: 'Noto Sans SC';
--mono-font: 'Noto Serif SC';
--white-monochrome: 243,243,243;
--pale-gray-monochrome: 255, 255, 255;
--light-gray-monochrome: 160, 160, 160;
--gray-monochrome:77,0,177;
--black-monochrome: 0,48,100;
--bright-accent: 78, 0, 212;
--medium-accent: 155, 0, 255;
--dark-accent: 78, 0, 212;
--pale-accent: 78, 0, 212;
--link-color: 0,70,244;
--visited-link-color: 245,50,150;
--hover-link-color: 0,216,231;
--newpage-color: 0,200,50;
--background-gradient-distance: 30rem;
--background-gradient-color: 200,200,200;
}
td, th, .yui-content {
border-color: rgba(var(--medium-accent)) !important;
}
.page-rate-widget-box {
background: rgba(var(--pale-gray-monochrome), 0.7);
border-color: rgba(var(--link-color));
border-width: 2px;
}
.code {
border-color: rgb(var(--newpage-color));
}
blockquote {
background-color: rgba(var(--pale-gray-monochrome), 0.7);
border-color: rgb(var(--link-color));
}
#skrollr-body {
width: 100%;
position: relative;
top: 0;
left: 0;
background-image: url("https://s2.loli.net/2022/06/22/ruTNRldIO1eS7yz.jpg");
background-repeat: repeat-x;
background-size: auto, auto;
background-position: center, center;
}
hr {
width: auto;
margin: auto;
position: relative;
height: 2.5px;
background-color: none;
pointer-events: none;
overflow: hidden;
border: initial;
-webkit-clip-path: polygon(50% 10%, 100% 50%, 50% 90%, 0% 50%);
clip-path: polygon(50% 10%, 100% 50%, 50% 90%, 0% 50%);
}
hr:before {
content: " ";
width: 100%;
height: 100%;
position: absolute;
background-attachment: fixed;
background-image: url('http://gaplouelpew.wdfiles.com/local--files/ori%3Agraffiti/color.jpg');
background-repeat: repeat;
background-position: center;
background-size: auto;
}
#header h2 span:before {
color: transparent;
background-image: url("http://gaplouelpew.wdfiles.com/local--files/ori%3Agraffiti/color.jpg");
background-clip: text;
-webkit-background-clip: text;
text-shadow: 0 -1.1rem 0 #FAF0FA, 0 -1.175rem 0 #000, 0 -1.025rem 0 #000, -0.075rem -1.1rem 0 #000, 0.075rem -1.1rem 0 #000, 0 -.9rem 0 #FFC0CB, 0 -.65rem 0 #FF69B4, 0 -.35rem 0 #FF1493 !important;
width: 100%;
height: 100%;
background-attachment: fixed;
}
#header h2 span {
font-size: 1.5em;
top: 1em;
font-family: "Noto Sans SC";
}
#container {
background-image: none;
}
#login-status a {
color: rgb(var(--white-monochrome));
}
#login-status {
border-radius: 2px;
background-color: rgb(var(--medium-accent));
padding: 5px;
border: 2px solid rgb(var(--gray-monochrome));
}
#login-status span {
color: rgb(var(--white-monochrome));
}
th {
background-color: rgb(var(--medium-accent)) !important;
}
.lightblock {
background-color:rgb(var(--pale-gray-monochrome));
}
.logoblock {
padding: 0.01rem 1rem;
color:rgb(var(--white-monochrome));
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
margin: 0.5rem 0 0.5rem 0.25rem;
display: block;
position: relative;
background-color: rgb(var(--gray-monochrome));
}
.logoblock::before {
content: "";
float: center;
border: solid 2px #0000;
background: url('https://s2.loli.net/2022/06/22/Un5iGVEO81NtAKr.png') center/70% no-repeat;
mix-blend-mode: multiply;
filter:blur(2.5px);
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.light-logoblock {
padding: 0.01rem 1rem;
color:rgb(var(--black-monochrome));
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
margin: 0.5rem 0 0.5rem 0.25rem;
display: block;
position: relative;
background-color: rgb(var(--pale-gray-monochrome));
}
.light-logoblock::before {
content: "";
float: center;
border: solid 2px #0000;
background: url('https://s2.loli.net/2022/06/22/Un5iGVEO81NtAKr.png') center/70% no-repeat;
mix-blend-mode: multiply;
filter:blur(2.5px);
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.titleblock {
background-color: rgb(var(--gray-monochrome));
color:rgb(var(--white-monochrome));
padding: 0.5rem 1rem 0.10rem;
margin: 1.5rem 0rem 0.5rem 0rem;
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
border: solid rgb(var(--medium-accent)) 0.3rem;
}
.titlebox {
color: rgb(var(--white-monochrome));
font-weight: 800;
font-size: 1.2rem;
position: relative;
top: -1.6rem;
background-color: rgb(var(--gray-monochrome));
border: solid rgb(var(--medium-accent)) 0.3rem;
padding: 0.25rem 1rem;
line-height: 0.1rem;
}
.light-titleblock {
background-color: rgb(var(--pale-gray-monochrome));
padding: 0.5rem 1rem 0.10rem;
margin: 1.5rem 0rem 0.5rem 0rem;
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
border: solid rgb(var(--medium-accent)) 0.3rem;
}
.light-titlebox {
font-weight: 800;
font-size: 1.2rem;
position: relative;
top: -1.6rem;
background-color: rgb(var(--pale-gray-monochrome));
border: solid rgb(var(--medium-accent)) 0.3rem;
padding: 0.25rem 1rem;
line-height: 0.1rem;
}
#search-top-box-input {
border-radius: 2px !important;
background-color: rgb(var(--medium-accent)) !important;
padding: 5px !important;
border: 2px solid rgb(var(--gray-monochrome)) !important;
}
#search-top-box-form input {
color: rgb(var(--pale-gray-monochrome)) !important;
}