更多操作
无编辑摘要 |
无编辑摘要 |
||
| 第3行： | 第3行： | ||
display: grid; | display: grid; | ||
grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); | grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); | ||
gap: | gap: 0.625rem 0.625rem; | ||
padding: 0 0 0.5rem 0; | padding: 0 0 0.5rem 0; | ||
text-align: center; | text-align: center; | ||
| 第33行： | 第33行： | ||
height: 0; | height: 0; | ||
color: white; | color: white; | ||
font-size: 1. | font-size: 1.25rem; | ||
line-height: 6rem; | line-height: 6rem; | ||
} | } | ||
2025年3月31日 (一) 14:06的版本
.home-genres-navigation {
width: 100%;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
gap: 0.625rem 0.625rem;
padding: 0 0 0.5rem 0;
text-align: center;
}
.home-genres-navigation .img-fit {
display: block;
background: black;
border-radius: 5px;
}
.home-genres-navigation .img-fit img{
width: 100%;
height: 6rem;
mask-image: linear-gradient(to left, rgba(0, 0, 0, 1), transparent);
border-radius: 5px;
object-fit: cover;
}
.home-genres-navigation .img-fit img:hover {
transform: scale(1.05);
}
.home-genres-navigation .title {
display: flex;
justify-content: space-around;
position: relative;
top: -6rem;
height: 0;
color: white;
font-size: 1.25rem;
line-height: 6rem;
}