直播记录/styles.css:修订间差异
小无编辑摘要 |
小无编辑摘要 |
||
(未显示同一用户的53个中间版本) | |||
第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 { | ||
第10行: | 第20行: | ||
gap: 10px; /* 子元素之间的间距 */ | gap: 10px; /* 子元素之间的间距 */ | ||
} | } | ||
/* 子元素样式 */ | /* 子元素样式 */ | ||
.item { | .item { | ||
flex: 1 1 | flex: 1 1 20%; /* 每行最多 4 个子元素 */ | ||
max-width: 360px; /* 最大宽度 */ | max-width: 360px; /* 最大宽度 */ | ||
min-width: | min-width: 290px; /* 最小宽度 */ | ||
height: 124px; | height: 124px; | ||
padding: 0; | padding: 0; | ||
第66行: | 第75行: | ||
max-width:90%; | max-width:90%; | ||
font-size: 24px; | font-size: 24px; | ||
text-align: right; | |||
} | } | ||
.item:hover{ | .item:hover{ | ||
第77行: | 第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; | |||
text-shadow:-1px -1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,1px 1px 0 #fff; | |||
} | |||
.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; | |||
} | } |