更多操作
小无编辑摘要 |
小无编辑摘要 |
||
第1行: | 第1行: | ||
/* 首页home-card--button的修复 */ | |||
.home-card--button { | .home-card--button { | ||
position: relative; | position: relative; | ||
第41行: | 第41行: | ||
@media (max-width: 510px) { | @media (max-width: 510px) { | ||
.infobox { | .infobox { | ||
margin: 0 auto 20px; | |||
width: 90%; | |||
float: none; | float: none; | ||
} | } | ||
.citizen-section { | .citizen-section { | ||
display: | display: block; | ||
} | } | ||
} | } |
2025年4月10日 (四) 23:31的版本
/* 首页home-card--button的修复 */
.home-card--button {
position: relative;
overflow: hidden;
}
.home-card__foreground {
position: absolute;
left: 15px;
top: 50%;
color: white;
font-weight: bold;
user-select: none;
pointer-events: none;
transform: translateY(-50%);
z-index: 2;
}
.home-card__background::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
content: "";
background: linear-gradient(90deg,
rgba(0, 0, 0, 1) 0%,
rgba(0, 0, 0, 0.4) 50%,
transparent 100%);
pointer-events: none;
z-index: 1;
}
/* 曲目信息infobox的修复 */
.infobox {
padding-left: 13px;
}
@media (max-width: 510px) {
.infobox {
margin: 0 auto 20px;
width: 90%;
float: none;
}
.citizen-section {
display: block;
}
}
/*红龙的神秘css*/
/* 首页背景缩放 */
#home-nav .home-card {
overflow: hidden;
position: relative;
}
#home-nav .home-card__background img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.3s ease;
transform-origin: center;
will-change: transform;
backface-visibility: hidden;
}
#home-nav .home-card:hover .home-card__background img {
transform: scale(1.07);
}