NeuroWiki

直播记录/styles.css：修订间差异

←上一编辑
小无编辑摘要
标签：已被回退
同步en站
标签：移动版编辑 移动版网页编辑
 
（未显示同一用户的50个中间版本）
第1行： 第1行：
.title_block{
padding: 2px;
padding-left: 8px;
background-color: #9147ff;
display: flex;
box-shadow: 0 2px 5px #aaa;
height: 32px;
align-items: center;
color: #fff;
}
/* 父容器样式 */
/* 父容器样式 */
.base_block {
.base_block {
第5行： 第15行：
box-shadow: 0 2px 5px #aaa;
box-shadow: 0 2px 5px #aaa;
display: flex;
display: flex;
justify-content: space-around; /* 确保子元素均匀分布 */
justify-content: space-between; /* 确保子元素均匀分布 */
flex-wrap: wrap; /* 允许子元素换行 */
flex-wrap: wrap; /* 允许子元素换行 */
padding: 15px;
padding: 15px;
gap: 10px; /* 子元素之间的间距 */
gap: 10px; /* 子元素之间的间距 */
}
@media screen and (max-width: 982px) {
.base_block {
padding-left:15px;
padding-right:15px;
}
}
@media screen and (min-width: 982px) {
.base_block {
padding-left:300px;
padding-right:300px;
}
}
}
/* 子元素样式 */
/* 子元素样式 */
.item {
.item {
flex: 1 1 calc((100% - 40px) / 4); /* 每行最多 4 个子元素 */
flex: 1 1 20%; /* 每行最多 4 个子元素 */
max-width: 360px; /* 最大宽度 */
max-width: 360px; /* 最大宽度 */
min-width: 200px; /* 最小宽度 */
min-width: 290px; /* 最小宽度 */
height: 124px;
height: 124px;
padding: 0;
padding: 0;
第35行： 第33行：
position: relative;
position: relative;
margin: 3px;
margin: 3px;
}
/* 占位符样式（伪元素） */
.base_block::after {
content: ''; /* 添加空白内容 */
flex: 1 1 calc((100% - 40px) / 4); /* 占位符的宽度与其他子元素一致 */
max-width: 360px;
min-width: 200px;
height: 124px; /* 高度与子元素一致 */
margin: 3px;
background-color: rgba(220, 220, 220, 0.8); /* 占位符背景透明 */
mask-image: linear-gradient(to right, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0));
}
}
.item1{
.item1{
第88行： 第75行：
max-width:90%;
max-width:90%;
font-size: 24px;
font-size: 24px;
text-align: right;
}
}
.item:hover{
.item:hover{
第99行： 第87行：
.item:hover > .img{
.item:hover > .img{
mask-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
mask-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
@media screen and (max-width: 1770px) {
.base_block {
padding-left:15px;
padding-right:15px;
}
.item7{
max-width:100%;
}
}
@media screen and (min-width: 1770px) {
.base_block {
padding-left:250px;
padding-right:250px;
}
.item7{
max-width:46.5%;
}
}
/* 表格页通用样式 */
.neuro{
background:#e3c3ad;
}
.evil{
background:#B30239;
color:#fff;
text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000 ,1px 1px 0 #000;
}
.evil a{
color:#ffdddd;
}
.neuro-evil{
background:#cb6273;
text-shadow:-1px -1px 0 #e3c3ad,1px -1px 0 #e3c3ad,-1px 1px 0 #e3c3ad,1px 1px 0 #e3c3ad;
}
.neuro-vedal{
background:#96ba8c;
text-shadow:-1px -1px 0 #4ab06b,1px -1px 0 #4ab06b,-1px 1px 0 #4ab06b,1px 1px 0 #4ab06b;
}
.evil-vedal{
background:#7e5952;
text-shadow:-1px -1px 0 #4ab06b,1px -1px 0 #4ab06b,-1px 1px 0 #4ab06b,1px 1px 0 #4ab06b;
}
.vedal{
background:#4ab06b;
}
.neuro-evil-vedal{
background:#a07c70;
color:#fff;
}
}
检索自“http://zh.neurosama.info/wiki/直播记录/styles.css”