这个版式由dby2022制作。
想要用这个版式,可以把
[[include :r-backrooms-wiki-cn:theme:qingmeng]]
塞到你的文档里!
文字
文字
文字
文字
文字
文字
文字1
文字
文字
文字
文字
文字
文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字
| 标题文字 | 标题文字 |
|---|---|
| 文字 | 文字 |
| 文字 | |
[[div class="lightblock"]]
文字
[[/div]]
[[div class="darkblock"]]
文字
[[/div]]
[[div class="styled-quote"]]
文字
[[/div]]
[[div class="dark-styled-quote"]]
文字
[[/div]]
[[div class="lightblock-c"]]
文字
[[/div]]
[[div class="darkblock-c"]]
文字
[[/div]]
[[div class="glassblock"]]
文字
[[/div]]
[[div class="hoverblock"]]
文字
[[/div]]
[[div class="light-hoverblock"]]
文字
[[/div]]
[[div class="dark-hoverblock"]]
文字
[[/div]]
[[div class="hover-rl-block"]]
文字
[[/div]]
[[div class="dark-hover-rl-block"]]
文字
[[/div]]
[[div class="white-hover-rl-block"]]
文字
[[/div]]
此外,你还可以给任意一个div类加上一个“y”类以加重边框阴影,各类用空格分开。
例
[[div class="lightblock y"]]
这里是将lightblock和“y”这个加重阴影的类相结合,其他类也可以这么做!
[[/div]]
[[div class="darkblock y"]]
这里是将darkblock和“y”这个加重阴影的类相结合,其他类也可以这么做!
[[/div]]
[[div class="hover-rl-block y"]]
这里是将hover-rl-block和“y”这个加重阴影的类相结合,其他类也可以这么做!
[[/div]]
/* GQ Theme [ 2023 Wikidot Theme ] by dby2022 CC-BY-SA */ @import url("https://arandintday.github.io/thebackhubscn/normalize-archived.css"); @import url("https://arandintday.github.io/thebackhubscn/bhl-archived.css"); @import url("https://arandintday.github.io/thebackhubscn/sidebar-archived.css"); @import url("https://arandintday.github.io/thebackhubscn/banlist.css"); @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;700;900&display=swap'); @import url('https://fastly.jsdelivr.net/gh/scp-cn-tech/sigma9@cn/modules/colstyle.min.css'); @import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css'); :root { --theme-base: "black-highlighter"; --theme-id: "liminal"; --theme-name: "Liminal Theme"; --logo-image: url("https://arandintday.github.io/thebackhubscn/logo.svg"); --header-title: "The Backrooms"; --header-subtitle: "让青绿色的梦在心中荡漾"; --body-font: Inter, Noto Sans SC, Arimo, Verdana, Geneva, sans-serif; --header-font: Inter, Noto Sans SC, Franklin Gothic Medium, Franklin Gothic, ITC Franklin Gothic, Arial, sans-serif; --title-font: var(--header-font); --mono-font: Recursive, Noto Serif SC, Consolas, monaco, monospace; --white-monochrome: 237, 239, 255; --pale-gray-monochrome: 230, 234, 255; --light-gray-monochrome: 120, 178, 184; --gray-monochrome: 71,102,132; --black-monochrome: 71,102,132; --bright-accent: 127,178,184; --medium-accent: 127,170,180; --dark-accent: 127,180,184; --pale-accent: 127,178,184; --swatch-topmenu-border-color: var(--medium-accent); /*链接颜色,调了好久 (*/ --link-color: 127,190,124; --hover-link-color: 119,199,89; --visited-link-color: 150,200,100; --rating-module-text-color: var(--gray-monochrome); --background-gradient-distance: 0rem; --gradient-header: linear-gradient(to top, rgba(var(--medium-accent)) 0%, rgba(var(--medium-accent), 0.90) 100%); --diagonal-stripes: linear-gradient(transparent 0); } /* #login-status { position: absolute !important; } #account-options { display: none !important; } */ #skrollr-body { background-image: radial-gradient(circle, rgb(var(--medium-accent)) 50%, transparent 0); background-repeat: repeat; background-size: 0.25em 0.25em; width: 100%; height: 7.5rem; } #side-bar .side-block div a img { filter: grayscale(100%); } #container { background-image: radial-gradient(circle, transparent 50%, transparent 0); background-size: 0.25em 0.25em; background-repeat: repeat; background-attachment: fixed; } div#page-options-bottom-2>a, div#page-options-bottom>a { border-radius: 0em; -moz-border-radius: 0em; border: none; } div#page-options-bottom-2>a:active, div#page-options-bottom-2>a:hover, div#page-options-bottom>a:active, div#page-options-bottom>a:hover { border: none; } #header, #top-bar { background-attachment: scroll; } #header { background-image: none; } #header::before { content: ""; position: absolute; height: 100%; width: 100%; left: 0; top: 0; background-image: var(--logo-image); background-size: auto 16rem; background-position: center; background-repeat: no-repeat; opacity: 0.4; } #header h1, #header h1 a { position: absolute; top: 1rem; margin: 0; width: 100%; display: flex; justify-content: center; z-index: 0; } #header h2, #header h2 span, #header h2 span::before { position: absolute; top: 2rem; margin: 0; width: 100%; display: flex; justify-content: center; } #header h1 a::before, #header h2 span::before { text-shadow: .063rem 0.1rem 0.1rem #0c0c0c; } a.newpage { background: transparent; text-decoration: none } a.newpage { color: rgb(var(--newpage-color)) } blockquote { box-shadow: 0.05rem 0.1rem 0.3rem rgba(0, 0, 0, .25); } /*基本div*/ .styled-quote { background-color: rgb(var(--pale-gray-monochrome)); border-left: 0.5rem solid rgba(var(--gray-monochrome)); padding: 0.1rem 1rem; margin: 0.5rem 0 0.5rem 0.25rem; box-shadow: 0.05rem 0.1rem 0.3rem rgba(0, 0, 0, .25); } .dark-styled-quote { background-color: rgb(var(--gray-monochrome)); border-left: 0.5rem solid rgba(var(--pale-gray-monochrome)); color: rgb(var(--white-monochrome)); padding: 0.1rem 1rem; margin: 0.5rem 0 0.5rem 0.25rem; box-shadow: 0.05rem 0.1rem 0.3rem rgba(0, 0, 0, .25); } .dark-styled-quote a { color: rgb(var(--swatch-menubg-medium-color)); } .lightblock { background-color: rgb(var(--white-monochrome)); padding: 0.01rem 1rem; margin: 0.5rem 0 0.5rem 0.25rem; box-shadow: 0 0.2rem 0.3rem rgba(0, 0, 0, .25); } .darkblock { background-color: rgb(var(--gray-monochrome)); color: rgb(var(--white-monochrome)); padding: 0.01rem 1rem; margin: 0.5rem 0 0.5rem 0.25rem; box-shadow: 0 0.2rem 0.3rem rgba(0, 0, 0, .25); } .darkblock a { color: rgb(var(--swatch-menubg-medium-color)); } /*高级一点的div*/ .lightblock-c { background-color: rgb(var(--white-monochrome)); padding: 0.01rem 1rem; margin: 0.5rem 0 0.5rem 0.25rem; box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px; } .darkblock-c { background-color: rgb(var(--gray-monochrome)); color: rgb(var(--white-monochrome)); padding: 0.01rem 1rem; margin: 0.5rem 0 0.5rem 0.25rem; box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px; } .glassblock { background-image: linear-gradient(-30deg, rgba(var(--medium-accent),.8) -80%, rgba(var(--white-monochrome),.4) 100%); border: solid rgb(var(--pale-accent)) 2px; padding: 0.01rem 1rem; margin: 0.5rem 0 0.5rem 0rem; box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25); } .hoverblock{ padding: 0.01rem 1rem; margin: 0.5rem 0 0.5rem 0rem; transition: box-shadow 0.3s ease-out; -webkit-transition: box-shadow 0.3s ease-out; } .hoverblock:hover,.hoverblock:focus{ box-shadow: 0px 4px 10px 0 rgba(0,0,0, .25); } .light-hoverblock{ padding: 0.01rem 1rem; margin: 0.5rem 0 0.5rem 0rem; transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; /* Safari */ } .light-hoverblock:hover,.light-hoverblock:focus{ background-color: rgb(var(--pale-gray-monochrome)); box-shadow: 0px 4px 10px 0 rgba(0,0,0, .25); } .dark-hoverblock{ padding: 0.01rem 1rem; margin: 0.5rem 0 0.5rem 0rem; transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; /* Safari */ } .dark-hoverblock:hover,.dark-hoverblock:focus{ background-color: rgb(var(--gray-monochrome)); color: rgb(var(--white-monochrome)); box-shadow: 0px 4px 10px 0 rgba(0,0,0, .25); } .hover-rl-block { background-image: linear-gradient(to right, #1A2980 0%, #26D0CE 51%, #1A2980 100%); margin: 10px; padding: 10px 40px; transition: 0.5s; background-size: 150% auto; color: white; box-shadow: 0 0 20px #eee; border-radius: 10px; display: block; } .hover-rl-block:hover { background-position: right center; color: #fff; } .dark-hover-rl-block { background-image: linear-gradient(to right, #16222A 0%, #3A6073 51%, #16222A 100%); margin: 10px; padding: 10px 40px; transition: 0.5s; background-size: 150% auto; color: white; box-shadow: 0 0 20px #eee; border-radius: 10px; display: block; } .dark-hover-rl-block:hover { background-position: right center; color: #fff; } .white-hover-rl-block { background-image: linear-gradient(to right, #50C9C3 0%, #96DEDA 51%, #50C9C3 100%); margin: 10px; padding: 10px 40px; transition: 0.5s; background-size: 150% auto; color: white; box-shadow: 0 0 20px #eee; border-radius: 10px; display: block; } .white-hover-rl-block:hover { background-position: right center; color: #fff; } /*加重阴影*/ .y { box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px; } #side-bar div.menu-item a[href*="/scp-"] { text-align: left !important; width: auto !important; } #side-bar div.menu-item.small a { justify-content: center; width: auto; padding: 0 0.25em; text-indent: 0; white-space: nowrap; } #side-bar div.menu-item a { justify-content: flex-start; padding: 0 0 0 calc(var(--base-font-size)*.93333); } #side-bar div.menu-item, #side-bar div.menu-item>p { display: flex; flex-shrink: 0; flex-basis: 100%; flex-flow: row wrap; align-items: center; justify-content: flex-start; height: 1.5rem; min-height: 1.5rem; margin: 0; padding: 0; box-shadow: inset 0 calc(var(--sidebar-internal-border-thickness)*-1) 0 0 rgba(var(--sidebar-border-color)); font-size: 0; } #side-bar div.menu-item>:last-child { flex-grow: 2; } #side-bar .side-block { margin-top: -0.5rem; } #side-bar div.menu-item a:not(a:first-child) { border-left: var(--sidebar-internal-border-thickness) solid rgba(var(--swatch-border-color), .08) } #side-bar div.scpnet-interwiki-wrapper { min-height: 300px; } .thread-container .post .long .content .image:not(.collapsible-block .image) { object-fit: cover; max-height: 2em; width: 100%; transition: max-height 0.5s; } .thread-container .post .long .content .image:hover:not(.collapsible-block .image) { max-height: 100em; } div.scpnet-interwiki-wrapper { margin: 0; width: auto; } iframe.scpnet-interwiki-frame { border: inherit; width: 100%; height: 230px; } @media (min-width:768px) { div.scpnet-interwiki-wrapper, iframe.scpnet-interwiki-frame { width: 100%; } } #page-content div#u-adult-warning { width: fit-content; margin: 0 auto 1.25rem; padding: 0.5rem 1rem; border: 3px solid #333; background: #e4e4e4; color: #333; text-align: center; font-weight: bold; } #page-content div#u-adult-warning > div#u-adult-header { font-size: 300%; text-shadow: 1px 2px 3px rgba(0, 0, 0, .5); color: #901; } #page-content div#u-adult-warning > div#u-adult-header p { margin: 0; } #page-content div#u-adult-warning > .error-block { color: unset; padding: unset; margin: unset; border: unset; margin-bottom: 1em; } #odialog-container .owindow>div.modal-body>img[style*="padding: 2px 8px;"]:first-child { background-color: initial!important; } /*解决Saving Page的BUG*/ 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(--white-monochrome,150,150,150));border:1px solid rgb(var(--gray-monochrome,0,0,0))}div#lock-info{font-size:0!important;margin:.8rem 0!important;padding:.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(--gray-monochrome,33,33,33));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}
版式作者:

