版式:四色极简
评分: -3+x

此版式由hm555hm555制作。

若需将本版式引入到你的页面中,请将以下文本放到任意位置:

[[include :backrooms-to-dv:theme:four]]

示例

URL

描述

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


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

此为分页(tab view)。

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


一条分割线

嵌套引用块

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

1
这段文本
放在这里
你们就能
看到不同
格式以及
其它东西
看起来是
怎么运作
包括那些不存在
以及存在的链接!


[[div class="lightblock"]]

[[/div]]

[[div class="darkblock"]]

[[/div]]

[[div class="styled-quote"]]

[[/div]]

[[div class="dark-styled-quote"]]

[[/div]]

[[div class="tquote"]]

[[/div]]


[[collapsible show="+ 展开样式代码" hide="- 收起样式代码"]]

/* 随便修改 好看就行 */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Bitter&display=swap');
 
/* 全局基础配置 */
:root {
    --theme-base: "black-highlighter";
    --theme-id: "blank";
    --theme-name: "Monochrome Theme";
 
    --logo-image: none;
    --header-title: "The Backrooms";
    --header-subtitle: "你曾经来过这里";
 
    --color-white: 255, 255, 255; /* 背景色 */
    --color-gray: 188, 188, 188;  /* 边框色 */
    --color-black: 20, 20, 20;    /* 文本与深色背景 */
    --color-t: 0, 0, 100; /* 蓝的 */
 
    /* 字体设置 */
    --body-font: Inter, Noto Sans SC, Noto Sans TC, Arimo, Verdana, Geneva, sans-serif;
    --header-font: var(--body-font);
    --title-font: var(--body-font);
    --mono-font: Bitter, Noto Serif SC, Noto Serif TC, Consolas, monaco, monospace;
}
 
/* 全局样式 */
* {
    scrollbar-color: rgb(var(--color-black)) transparent !important;
    box-sizing: border-box;
}
 
#skrollr-body,
#container {
    background-color: rgb(var(--color-white));
    background-image: none;
}
 
#content-wrap {
    margin-left: 0;
}
 
#main-content {
    padding-bottom: 3em;
    position: relative;
}
 
#main-content::before {
    background-color: rgb(var(--color-white)) !important;
}
 
/* 顶栏导航 */
#top-bar {
    width: 100%;
}
 
#top-bar div.mobile-top-bar>ul>li>a,
#top-bar div.top-bar>ul>li>a {
    color: rgb(var(--color-black));
    text-decoration: none;
    padding: 0.5em 1em;
    transition: background-color 300ms, color 300ms;
}
 
#top-bar div.mobile-top-bar>ul>li:hover>a,
#top-bar div.top-bar>ul>li:hover>a,
#top-bar div.mobile-top-bar>ul>li:focus-within>a,
#top-bar div.top-bar>ul>li:focus-within>a {
    background-color: rgb(var(--color-black));
    color: rgb(var(--color-white));
}
 
#top-bar div.mobile-top-bar>ul>li>ul,
#top-bar div.top-bar>ul>li>ul {
    background-color: rgb(var(--color-white));
    border: 1px solid rgb(var(--color-gray));
}
 
#top-bar div.mobile-top-bar>ul>li>ul>li,
#top-bar div.top-bar>ul>li>ul>li {
    transition: background 300ms;
}
 
#top-bar div.mobile-top-bar>ul>li>ul>li:hover,
#top-bar div.top-bar>ul>li>ul>li:hover {
    background-color: rgb(var(--color-gray));
}
 
#top-bar div.mobile-top-bar>ul>li>ul>li>a,
#top-bar div.top-bar>ul>li>ul>li>a {
    color: rgb(var(--color-black));
    text-decoration: none;
    padding: 0.5em 1em;
}
 
#top-bar div.mobile-top-bar>ul>li>ul>li:hover>a,
#top-bar div.top-bar>ul>li>ul>li:hover>a {
    color: rgb(var(--color-black));
}
 
/* 侧栏导航 */
#side-bar {
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    width: 240px;
    background-color: rgb(var(--color-white));
    border-right: 1px solid transparent;
    overflow-y: auto;
    transition: border-color 300ms;
    padding: 1em 0;
}
 
#side-bar:hover {
    border-right: 1px solid rgb(var(--color-gray));
}
 
#side-bar .heading {
    border-top: 1px solid rgb(var(--color-gray));
    border-bottom: 1px solid rgb(var(--color-gray));
    margin: 1em 0;
}
 
#side-bar .heading p {
    background-color: rgb(var(--color-black));
    color: rgb(var(--color-white));
    padding: 0.3em 0.8em;
    margin: 0;
}
 
#side-bar div.menu-item {
    margin: 0.5em 0;
}
 
#side-bar div.menu-item a {
    color: rgb(var(--color-black));
    text-decoration: none;
    padding: 0.4em 1em;
    display: block;
    transition: background-color 300ms, color 300ms;
}
 
#side-bar div.menu-item a:hover {
    background-color: rgb(var(--color-black));
    color: rgb(var(--color-white));
}
 
#side-bar .side-block>.collapsible-block .collapsible-block-link {
    color: rgb(var(--color-black));
    text-decoration: none;
    padding: 0.4em 1em;
    display: block;
    transition: background-color 300ms, color 300ms;
}
 
#side-bar .side-block>.collapsible-block .collapsible-block-link:hover {
    background-color: rgb(var(--color-gray));
    color: rgb(var(--color-black));
}
 
/* 核心容器样式 */
.lightblock {
    margin: 1em 0;
    border: 1px solid rgb(var(--color-gray));
    background-color: rgb(var(--color-white));
    padding: 1em;
    color: rgb(var(--color-black));
    /* 可修改 */
}
 
.code {
    border: 1px dashed rgb(var(--color-gray));
    background-color: rgb(var(--color-white));
    color: rgb(var(--color-black));
    padding: 1em;
    overflow-x: auto;
    /* 可修改 */
}
 
.blockquote,
blockquote {
    border: 1px solid rgb(var(--color-gray));
    background-color: rgb(var(--color-white));
    color: rgb(var(--color-black));
    padding: 1em;
    margin: 1em 0;
    /* 可修改 */
}
 
.tquote,
tquote {
    border: 1px solid rgb(var(--color-gray));
    background-color: rgb(var(--color-white));
    color: rgb(var(--color-t));
    padding: 1em;
    margin: 1.1em 0;
}
 
table.wiki-content-table {
    width: 100%;
    border-collapse: collapse;
    margin: 1em 0;
}
 
table.wiki-content-table tr,
table.wiki-content-table th,
table.wiki-content-table td {
    border: 1px solid rgb(var(--color-gray)) !important;
    padding: 0.5em;
}
 
table.wiki-content-table th {
    background-color: rgb(var(--color-black));
    color: rgb(var(--color-white));
}
 
.yui-navset .yui-nav {
    border: 1px solid rgb(var(--color-gray));
    margin: 1em 0;
}
 
.yui-navset .yui-nav a {
    background-color: rgb(var(--color-white));
    color: rgb(var(--color-black));
    padding: 0.5em 1em;
    text-decoration: none;
    transition: background-color 300ms, color 300ms;
}
 
.yui-navset .yui-nav a:hover {
    background-color: rgb(var(--color-black));
    color: rgb(var(--color-white));
}
 
.yui-navset .yui-nav .selected a {
    background-color: rgb(var(--color-black));
    color: rgb(var(--color-white)) !important;
}
 
/* 响应式适配 */
@media only screen and (max-width: 768px) {
    #side-bar {
        position: static;
        width: 100%;
        height: auto;
        border-right: none;
        border-bottom: 1px solid rgb(var(--color-gray));
    }
 
    #search-top-box-form {
        display: none;
    }
 
    #main-content {
        font-size: 90%;
    }
}
除非特别注明,本页内容采用以下授权方式: Creative Commons Attribution-ShareAlike 3.0 License