情感缢裂 版式

著作信息

---

发布者：Quisqualis

---

一张来自浮动站Area-CN-14的照片，被借用在这里做版式展示。

本文代码参考了新世代東弊重工 版式和《朝颜文学报特刊》：实验性文章布局及其使用方法，以及CSS主题制作工具。您可以通过在页面开头加上[[include :scp-wiki-cn:theme:emotion-division]]以使用此版式。

情感缢裂版式为一美学版式，其通常应和夏日、情感相关的文章配合使用。此外，其被应用于Area-CN-14的相关文章当中。下展示该主题下一些主要结构的变化。以下的文字和右侧图片来自SCP-CN-2733和青空社¹一文，图片出处不重复注明。

“日常是某种永恒存在的事物。青空社的宗旨在于讲述关于日常的故事，用日常展现心灵和情感。如果人们能够被故事触动，而故事又能够描摹人们所不容易察觉和辨识的细微的情感，能够让人们意识到自己所身处的生活当中的美好，或是在夏天海风吹过的某一个瞬间，能够让人们意识到‘大家都拥有着这样的心情’的话，那便就足够了。”

---

展示标题样式

一级标题

二级标题

三级标题

四级标题

五级标题

六级标题

---

此为emotion-note式div块。

此为以修正花卉标识配色为基底的fixed-flower-note式div块。
这里有一个错视觉问题：这个块的背景颜色和上面那个是一样的哦。

此为emotion-blockquote式div块。

此为没有边框的emotion-blockquote-noborder式div块。

此为圆角并且发光的emotion-blockquote-shadow式div块。

原始引用格式除背景颜色改变外保留不变。
更多文字。

---

一条分割线。

嵌套引用块。

---

分页

此为分页（tab view）。

在你的作品开头添加如下语法以应用此版式：

分页

看，这有更多文字。

多么精巧绝伦。

长 Tab

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

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

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

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

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

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

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

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

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

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

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

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

由于一些奇怪的原因，这个空 tab 有一个很长的名字。我想知道为什么？这很奇怪。

空 Tab

空 Tab

空 Tab

空 Tab

空 Tab

---

链接。
尚不存在的链接。

---

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

---

后续更新。

---

故事最后会消融在空气当中，而语词也与之相同。情感的结构最后也终将崩塌破碎。然而，只要存在那一瞬间——那短暂的，阳光照过面前的落叶、冰淇淋从歪斜的蛋卷上滑落、演唱会上安可的应援声响起的一瞬间，语词足以架起一座桥梁，或是作为一叶孤舟，渡过困难的，广大的，人人相异的情感之海，那人类便还存在着摆脱孤独的希望，就算这孤独会是永恒的终局。

不论是走出地铁站，望向天空，写下“果然还是橘子味最好了吧”的我；还是在夏夜祭的摊位前流连，托起一份刨冰而驻足不前的我；亦或是坐在海风和热砂之上，等待着灿烂的夏星照耀的我，一瞬间面前都仿佛出现了一片无穷无尽的碧蓝之海，而一作由黑白语词组成的浮桥在地平线上的远方向前延伸着，很远很远，直到无法看见的地方。直到你所站在的地方。

于是我向那里奔去。

---

展示源代码

:root {
  --header-title: "SCP基金会";
  --header-subtitle: "现实所描述者乃情感 情感所链接者乃现实";
  --accentColor: rgb(255, 255, 255);
  --ac: #F5FFFF;
}
 
/*============== 搜索区 ===============*/
 
#search-top-box-form input[type=submit] {
    outline: 0;
    height: 2em;
    border: 0px solid blue;
    border-radius: 1px;
    color: FFF;
    background: transparent;
 
    position: relative;
    top: -1px;
 
    box-shadow: none;
}
 
#search-top-box-form input[type=submit]:hover,
#search-top-box-form input[type=submit]:focus {
    border: 1px solid FFF;
    border-radius: 1px;
    background: #91A3D2;
}
 
#search-top-box-form input[type=submit]:active {
    border: 1px solid blue;
    border-radius: 1px;
    color: #000;
    background: #91A3D2;
}
 
#search-top-box-input {
    border: solid 0px #999;
    border-radius: 1px;
    color: #ccc;
    background-color: white;
    box-shadow: inset 0px 0px 0px rgb(0 0 0 / 50%);
    opacity:10%;
}
 
#search-top-box-input:hover, #search-top-box-input:focus {
    border: solid 1px #fff;
    color: #fff;
    background-color: white;
    box-shadow: inset 0px 0px 0px rgb(0 0 0 / 80%);
    opacity:50%;
}
 
/*============== 登陆讯息显示 ===============*/
 
#login-status a {
    background: transparent;
    color: grey;
}
 
#account-topbutton {
    font-size: 80%;
    font-weight: bold;
    padding: 0 5px;
    border: 0px solid #888;
    margin-left: 5px;
    text-decoration: none;
    background-color: #FFF;
}
 
/*============== top-bar ===============*/
 
#top-bar ul li a {
    border-left: solid 0px rgba(64,64,64,.1);
    border-right: solid 0px rgba(64,64,64,.1);
    text-decoration: none;
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 1px;
    max-height: 1px;
    overflow: hidden;
}
 
#top-bar ul li.sfhover a:hover, #top-bar ul li:hover a:hover {
    background: #DDDCE4;
    text-decoration: none;
}
 
#top-bar ul li.sfhover a, #top-bar ul li:hover a {
    background: #eee;
    color: purple;
    border-left: solid 1px rgba(64,64,64,1);
    border-right: solid 1px rgba(64,64,64,1);
}
 
/*============== 版头和背景 ===============*/
 
div#container-wrap {
    background: url(https://s1.ax1x.com/2022/12/22/zXfI9U.jpg) top left repeat-x ;
}
 
div#header h1 a span {
    font-size: 0px;
}
div#header h1 a:before {
    content: var(--header-title);
    color: #DDDCE4;
font-weight: bold;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .8);
 
}
div#header h2 span {
    font-size:0px;
    padding: 4px;
}
div#header h2:after {
    content:  var(--header-subtitle);
    font-weight: bold;
    color: #DDDCE4;
    padding: 19px 0;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .8);
    white-space: pre;
}
 
/*============== 侧边栏 ===============*/
 
#side-bar .side-block {
    border-radius: 0;
    position: relative;
    border: none;
    box-shadow: 0px 0px 4px blue;
    color: #2E75B6;
    background: #fafffa;
    background-color: #fafffa !important;
}
 
#side-bar div.menu-item a {
    font-weight: bold;
    color: #2E75B6;
    text-decoration: none;
    background: transparent;
}
 
h1, #page-title {
    color: #2E75B6;
    padding: 0 0 0.25em;
    margin: 0 0 0.6em;
    font-weight: normal;
}
 
#page-title {
    margin: 0 0 0.5em 0;
    padding-top: 0.5em;
    font-size: 200%;
    border-bottom: 1.5px solid #2E75B6;
}
 
/*============== 标题 ===============*/
 
h1 {
    color: #2E75B6;
}
 
h2,h3,h4,h5,h6 {
    color: #0D7FF0;
}
 
/*============== div ===============*/
 
.emotion-note {
  position:relative;
  margin-bottom: 15px;
  padding: 0.1px 15px 0.1px 15px;
  background-color: var(--ac);
  box-shadow:   inset 2px 0 lightblue, inset 0px 2px lightblue, inset 0px -2px lightblue, inset -2px 0 lightblue, inset 4px 0 #DDDCE4, inset 0px 4px #DDDCE4, inset 0px -4px #DDDCE4, inset -4px 0 #DDDCE4;
}
.emotion-note:before {
  position: absolute;
  top: 0;
  right: 0;
  width: 0px;
  border-width: 0px 15px 15px 0px;
  border-style: solid;
  border-color: #FFF #FFF lightblue #FFF;
  content: '';
  box-shadow: -1px 1px 2px #DDDCE4;
}
 
.emotion-blockquote {
  position:relative;
  margin-bottom: 15px;
  padding: 0.1px 10px 0.1px 10px;
  border: 1.5px solid #51E7FC;
  background-color: #F1F8F8;
}
 
.fixed-flower-note {
  position:relative;
  margin-bottom: 15px;
  padding: 0.1px 15px 0.1px 15px;
  background-color: var(--ac);
  box-shadow:  inset -1px 0 #E6ADF3, inset 0px 1px #E6ADF3, inset 1px 0 #E6ADF3, inset 0px -1px #E6ADF3, inset -2px 0 #ECBFDC, inset 0px 2px #ECBFDC, inset 2px 0 #ECBFDC, inset 0px -2px #ECBFDC, inset -3px 0 #FFD19F, inset 3px 0 #FFD19F, inset 0px 3px #FFD19F, inset 0px -3px #FFD19F, inset -4px 0 #E4E3F6, inset 4px 0 #E4E3F6, inset 0px 4px #E4E3F6, inset 0px -4px #E4E3F6, inset -5px 0 #F4BEB7, inset 5px 0 #F4BEB7, inset 0px 5px #F4BEB7, inset 0px -5px #F4BEB7, inset -6px 0 #DBF9AE, inset 6px 0 #DBF9AE, inset 0px 6px #DBF9AE, inset 0px -6px #DBF9AE;
}
.fixed-flower-note:before {
  position: absolute;
  top: 0;
  right: 0;
  width: 0px;
  border-width: 0px 15px 15px 0px;
  border-style: solid;
  border-color: #FFF #FFF #E6ADF3 #FFF;
  content: '';
  box-shadow: -1px 1px 2px #DBF9AE;
}
 
div.blockquote {
    border: 1px dashed #999;
    background-color: #F1F8F8;
    padding: 0 1em;
    margin: 1em 3em;
}
 
blockquote {
    border: 1px dashed #999;
    padding: 0 1em;
    background-color: #F1F8F8;
}
 
.emotion-blockquote-noborder {
  position:relative;
  margin-bottom: 15px;
  padding: 0.1px 10px 0.1px 10px;
  border: 0;
  background-color: #F1F8F8;
 
}
 
.emotion-blockquote-shadow {
  position:relative;
  margin-bottom: 15px;
  padding: 0.1px 10px 0.1px 10px;
  border: 1px solid #51E7FC;
  background-color: #F1F8F8;
  box-shadow:  1px 0 3px #DAFFFF, 0px 1px 3px #DAFFFF, 0px -1px 3px #DAFFFF, -1px 0 3px #DAFFFF;
  border-radius: 5px;
}
 
/*============== 折叠 ===============*/
 
.collapsible-block .collapsible-block-link {
  display: block;
  width: calc(100% - 22.5px);
  color: #2E75B6;
}
.collapsible-block .collapsible-block-folded .collapsible-block-link {
  color: #2E75B6;
}
.collapsible-block .collapsible-block-folded .collapsible-block-link a:hover {
  color: #2E75B6;
}
.collapsible-block .collapsible-block-unfolded .collapsible-block-link {
  color: #2E75B6;
}
.collapsible-block .collapsible-block-unfolded .collapsible-block-link a:hover {
  color: #2E75B6;
}
 
/*============== 分割线 ===============*/
 
hr {
    background: #F9C5FC;
    color: #F9C5FC;
}
 
/*============== 图像，因为没有修改思路所以保留不变 ===============*/
 
.scp-image-block {
 
}
.scp-image-block.block-right {
}
.scp-image-block .scp-image-caption {
 
}
.scp-image-block .scp-image-caption:before {
}
 
/*============== YUI TABS ===============*/
 
div#page-content div.yui-navset.yui-navset-top > ul.yui-nav {
    border: none;
    display: flex;
    flex-wrap: wrap;
}
 
div#page-content div.yui-navset.yui-navset-top > ul.yui-nav > li {
    margin: 0;
    padding: 0;
    height: 1.5rem;
    border: none;
    flex-grow: 1;
    max-width: 100%;
}
 
div#page-content div.yui-navset.yui-navset-top > ul.yui-nav > li > a {
    margin: 0;
    padding: 0 0.8rem;
    width: 100%;
    height: 100%;
    max-width: 100%;
    text-align: center;
    overflow: hidden;
    color: rgb(255, 255, 255);
    background-image: none;
    background-color: #7BA7EE;
    box-sizing: border-box;
    transition: ease 0.25s;
    border: none;
}
 
div#page-content div.yui-navset.yui-navset-top > ul.yui-nav > li > a:focus,
div#page-content div.yui-navset.yui-navset-top > ul.yui-nav > li > a:hover {
    color: rgb(255, 255, 255);
    background-color: #2E75B6;
    zoom: unset;
}
 
div#page-content div.yui-navset.yui-navset-top > ul.yui-nav > li.selected > a,
div#page-content div.tui-navset.yui-navset-top > ul.yui-nav > li.selected > a:focus,
div#page-content div.yui-navset.yui-navset-top > ul.yui-nav > li.selected > a:hover {
    color: rgb(0, 0, 0);
    background-color: #F5FFFF;
    background-image: none;
    zoom: unset;
}
 
div.yui-navset.yui-navset-top > ul.yui-nav > li > a > em {
    display: block;
    padding: 0;
    margin: 0;
    height: 100%;
    line-height: 1.5rem;
    border: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    zoom: unset;
}
 
div.yui-navset.yui-navset-top > div.yui-content {
    border: 0.5px solid  lightblue;
    padding: 0 1rem;
    background-color: #F1F8F8;
    zoom: unset;
}
 
div.yui-navset.yui-navset-top > div.yui-content > div {
    padding: 1px;
    margin: -1px;
}
 
.yui-navset .yui-nav, .yui-navset .yui-navset-top .yui-nav {
    border-width: 0 0 5px;
    Xposition: relative;
    zoom: 1;
}
 
/*============== 链接 ===============*/
a.visited {
  color: #0D7FF0;
}
a.newpage {
  color: #7BA7EE;
}
a {
  color: #2E75B6;
}
 
/*============== 评分块 ===============*/
 
table.wiki-content-table th {
    border: 1px solid #CD80F1;
    padding: 0.3em 0.7em;
    background-color: #F1F8F8;
}
 
table.wiki-content-table td {
    border: 1px solid #CD80F1;
    padding: 0.3em 0.7em;
}
 
.rate-box-with-credit-button {
  position: relative;
}
.page-rate-widget-box {
  border-radius: 0px;
  box-shadow: none;
}
.page-rate-widget-box .rate-points {
  border: 1px solid #C284D5;
  border-radius: 0;
  background-color: #51E7FC !important;
  color: #F5FFFF;
}
.page-rate-widget-box .rateup, .page-rate-widget-box .ratedown {
  border-top: 1px solid #C284D5;
  border-bottom: 1px solid #C284D5;
  background-color: #F5FFFF;
}
.page-rate-widget-box .rateup a, .page-rate-widget-box .ratedown a {
  color: #91A3D2;
}
.page-rate-widget-box .rateup a:hover, .page-rate-widget-box .ratedown a:hover {
  background: #51E7FC;
  color: #F5FFFF;
}
.page-rate-widget-box .cancel {
  border: 1px solid #C284D5;
  border-radius: 0;
  background-color: #51E7FC;
}
.page-rate-widget-box .cancel.btn a {
  color: #F5FFFF;
}
.page-rate-widget-box .cancel.btn a:hover {
  border-radius: 0;
  background: transparent;
  color: #91A3D2;
}
 
#page-content .rate-box-with-credit-button {
  background-color: #51E7FC;
  border: 1px solid #C284D5;
  border-radius: 0px;
  box-shadow: none;
}
#page-content .creditButton p a {
  border-left-color: #C284D5;
}
#page-content .creditButton p a:hover {
  color: #51E7FC;
}
.page-rate-widget-box, .modalbox .page-rate-widget-box, #page-content .creditButtonStandalone {
  position: relative;
}
 
#page-content .rate-box-with-credit-button .rate-points:before {
  display: none;
}
#u-credit-view .modalbox {
  box-shadow: 0 2px 6px rgb(72 72 72 / 50%);
}
.modalbox .page-rate-widget-box .rate-points:before {
  z-index: 10;
}
#page-content .creditButtonStandalone p a {
  background-color: #CD80F1;
  border-radius: 0px;
  box-shadow: none;
}
#page-content .creditButtonStandalone p a:hover {
  color: #51E7FC;
}
 
/*============== 脚注 ===============*/
 
.footnotes-footer .title {
    margin: 0.5em 0;
    font-size: 130%;
    font-weight: bold;
    color: #91A3D2;
}

Footnotes

1. 即《朝颜文学报特刊》：盛夏的海风与八月的遐想：写在青空社建社二十周年之际