更多操作
无编辑摘要 |
无编辑摘要 |
||
第3行: | 第3行: | ||
min-width: 600px; | min-width: 600px; | ||
display: grid; | display: grid; | ||
grid-template-columns: 1fr | grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); | ||
gap: 5px 5px; | gap: 5px 5px; | ||
padding: 0 0 5px 0; | padding: 0 0 5px 0; |
2025年3月31日 (一) 13:57的版本
.home-genres-navigation { width: 100%; min-width: 600px; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 5px 5px; padding: 0 0 5px 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: 100px; 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: -100px; height: 0; color: white; font-size: 1.2rem; line-height: 100px; }