这是林泊百科的迁移技术测试站点，所有改动不会同步到林泊百科上，此站点将会在正式迁移后关闭，请勿存放重要数据

用户:晨茗biu～/common.css：修订间差异

来自Limbo Wiki
跳转到导航 跳转到搜索
晨茗biu～​（留言 | 贡献）
行政员、​用户查核员、​界面管理员、​premiumuser、​监督员、​管理员、​微件编辑者
495次编辑
晨茗biu～​（留言 | 贡献）
行政员、​用户查核员、​界面管理员、​premiumuser、​监督员、​管理员、​微件编辑者
495次编辑
创建页面，内容为“<div class="container"> <div class="pixel one"></div> </div> <style> .container { →像素画的大小：​ width: 100px; height: 100px; } .pixel { →使伪元素的位置可调整：​ position: relative; } .pixel::before { content: ""; →一个点的大小(例:20px x 20px)：​ width: 20px; height: 20px; →box-shadow 着色，伪元素设为透明：​ background-color: transparent; /* 调整伪元素位置，让左上角成为(0,0)…”
标签：（旧）WikiEditor
 
晨茗biu～​（留言 | 贡献）
行政员、​用户查核员、​界面管理员、​premiumuser、​监督员、​管理员、​微件编辑者
495次编辑
小 孩子们，不要干用纯CSS画像素画这种抽象事，一堆代码直接让我编辑器卡的动不了了
标签：替换 （旧）WikiEditor
 
（未显示同一用户的19个中间版本）
第1行： 第1行：
<div class="container">
/*模板:曲里拐弯故事会：START*/
  <div class="pixel one"></div>
.Distorted-Story-Infobox {
</div>
    border:1px solid;
 
    border-spacing: 3px;
<style>
    background-color: #f8f9fa;
.container {
    padding: 0.2em;
  /* 像素画的大小 */
    line-height: 1.5em;
  width: 100px;
    border-left: 10px solid;
  height: 100px;
    margin:0 20% 0 0;
    width:80%;
    }
.Distorted-Story-Infobox td{
    border:0 !important;
}
}
 
   
.pixel {
.Distorted-Story-text{
  /* 使伪元素的位置可调整 */
background: black;
  position: relative;
}
}
.pixel::before {
   
  content: "";
@media screen and (max-width: 850px) {
 
    .Distorted-Story-Infobox {
  /* 一个点的大小(例:20px x 20px) */
        margin:0;
  width: 20px;
        width:100% !important;
  height: 20px;
    }
  /* box-shadow 着色，伪元素设为透明 */
  background-color: transparent;
 
  /* 调整伪元素位置，让左上角成为(0,0) */
  position: absolute;
  top: -20px;
  left: -20px;
}
}
@media (prefers-color-scheme: dark) and (max-width: 850px) {
    .Distorted-Story-Infobox {
        position: relative;
        border: 1px solid transparent;
        border-left: 10px solid transparent;
        border-image: linear-gradient(
            to right,
            #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
            #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
            #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
            #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
            #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
            #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
            #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
            #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
            #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0
        ) 1;
    }


.pixel.one::before {
.Distorted-Story-Infobox::before {
  box-shadow:
        content: "";
    /* 列　行 色 */
        position: absolute;
    /* 第1列 */
        top: -1px;
    20px   20px #FB0600,
        left: -10px;
    20px   40px #FC322F,
        bottom: -1px;
    20px  60px #FC6663,
        width: 10px;
    20px  80px #FD9999,
        background: repeating-linear-gradient(
    20px 100px #FECCCB,  
            to bottom,
    /* 第2列 */
            #ff9999 0%,   #ffb366 5%,  #ffeb99 10%,
    40px  20px #60169F,
            #7ddf90 15%, #66b3ff 20%,  #9999ff 25%, #d49be0 30%
    40px  40px #7A23B0,
        );
    40px  60px #964DC2,
    }
    40px  80px #B681D9,
   
    40px  100px #D8BEED,  
.Distorted-Story-text{
    /* 第3列 */
background: linear-gradient(
    60px  20px #1388BC,
        to right,
    60px  40px #269DC9,
        #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
    60px  60px #55B3D7,
        #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
    60px  80px #88CAE2,
        #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0
    60px  100px #BFE3EF,  
    );
    /* 第4列 */
     }
    80px  20px #ACD902,
    80px  40px #BDE02D,
    80px  60px #CDEA5E,
    80px  80px #DBEF8E,
    80px  100px #F4FBC8,  
    /* 第5列 */
    100px  20px #FB8F02,
    100px  40px #FDA533,
    100px  60px #FDBB64,
    100px  80px #FED39A,
     100px 100px #FDE8C9;
}
}
</style>
/*模板:曲里拐弯故事会：END*/

2026年6月6日 (六) 16:52的最新版本

/*模板:曲里拐弯故事会：START*/
.Distorted-Story-Infobox {
    border:1px solid;
    border-spacing: 3px;
    background-color: #f8f9fa;
    padding: 0.2em;
    line-height: 1.5em;
    border-left: 10px solid;
    margin:0 20% 0 0;
    width:80%;
    }
.Distorted-Story-Infobox td{
    border:0 !important;
}
    
.Distorted-Story-text{
	background: black;
}
    
@media screen and (max-width: 850px) {
    .Distorted-Story-Infobox {
        margin:0;
        width:100% !important;
    }
}
@media (prefers-color-scheme: dark) and (max-width: 850px) {
    .Distorted-Story-Infobox {
        position: relative;
        border: 1px solid transparent;
        border-left: 10px solid transparent;
        border-image: linear-gradient(
            to right,
            #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
            #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
            #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
            #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
            #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
            #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
            #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
            #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
            #ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0
        ) 1;
    }

	.Distorted-Story-Infobox::before {
        content: "";
        position: absolute;
        top: -1px;
        left: -10px;
        bottom: -1px;
        width: 10px;
        background: repeating-linear-gradient(
            to bottom,
            #ff9999 0%,   #ffb366 5%,   #ffeb99 10%,
            #7ddf90 15%,  #66b3ff 20%,  #9999ff 25%,  #d49be0 30%
        );
    }
    
	.Distorted-Story-text{
		background: linear-gradient(
        	to right,
        	#ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
        	#ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0,
        	#ff9999, #ffb366, #ffeb99, #7ddf90, #66b3ff, #9999ff, #d49be0
    	);
    }
}
/*模板:曲里拐弯故事会：END*/
检索自“https://pigeongames.gaoice.run/index.php?title=用户:晨茗biu～/common.css&oldid=55476”