无编辑摘要 标签：手工回退   |
无编辑摘要 标签： |
||
| 第1行： | 第1行： | ||
<!-- Nav --> | <!-- Nav --> | ||
<div class="home-grid home-button"> | <div class="home-grid home-button"> | ||
<div class=" | <div class="nav-card nav-card--button"> | ||
<div class=" | <div class="nav-card__background">[[文件:Cardbg.jpg|300px|link=易什春秋]]</div> | ||
<div class=" | <div class="nav-card__foreground nav-card__navimgtext">了解我们</div> | ||
</div> | </div> | ||
<div class=" | <div class="nav-card nav-card--button"> | ||
<div class=" | <div class="nav-card__background">[[文件:Cardbg.jpg|300px|link=游戏列表]]</div> | ||
<div class=" | <div class="nav-card__foreground nav-card__navimgtext">游戏列表</div> | ||
</div> | </div> | ||
<div class=" | <div class="nav-card nav-card--button"> | ||
<div class=" | <div class="nav-card__background">[[文件:Cardbg.jpg|300px|link=Category:玩家攻略]]</div> | ||
<div class=" | <div class="nav-card__foreground nav-card__navimgtext">玩家攻略</div> | ||
</div> | </div> | ||
<div class=" | <div class="nav-card nav-card--button"> | ||
<div class=" | <div class="nav-card__background">[[文件:Cardbg.jpg|300px|link=EaseCation_Wiki:人文关怀]]</div> | ||
<div class=" | <div class="nav-card__foreground nav-card__navimgtext">人文关怀</div> | ||
</div> | </div> | ||
</div> | </div> | ||
<!-- CSS --> | <!-- CSS --> | ||
{{#CSS: | {{#CSS: | ||
. | .nav-card { | ||
position: relative; | position: relative; | ||
padding: 15px; | padding: 15px; | ||
| 第34行： | 第34行： | ||
} | } | ||
#home-nav . | #home-nav .nav-card__background:after { | ||
position: absolute; | position: absolute; | ||
pointer-events: none; | pointer-events: none; | ||
| 第46行： | 第46行： | ||
} | } | ||
#home-nav . | #home-nav .nav-card__foreground { | ||
pointer-events: none; | pointer-events: none; | ||
height: 100%; | height: 100%; | ||
| 第58行： | 第58行： | ||
. | .nav-card__navimgtext { | ||
pointer-events: none; | pointer-events: none; | ||
height: 100%; | height: 100%; | ||
| 第69行： | 第69行： | ||
} | } | ||
. | .nav-card__background { | ||
position: absolute; | position: absolute; | ||
top: 0; | top: 0; | ||
| 第79行： | 第79行： | ||
} | } | ||
. | .nav-card__background img { | ||
width: 100%; | width: 100%; | ||
height: 100%; | height: 100%; | ||
| 第86行： | 第86行： | ||
} | } | ||
. | .nav-card__foreground { | ||
position: absolute; | position: absolute; | ||
} | } | ||
. | .nav-card p { | ||
margin-top: 0.2rem; | margin-top: 0.2rem; | ||
font-size: 0.875rem; | font-size: 0.875rem; | ||
} | } | ||
. | .nav-card.nav-card--button { | ||
overflow: hidden; | overflow: hidden; | ||
padding: 0; | padding: 0; | ||
| 第101行： | 第101行： | ||
} | } | ||
. | .nav-card--button a { | ||
display: flex; | display: flex; | ||
height: 100%; | height: 100%; | ||
| 第112行： | 第112行： | ||
} | } | ||
. | .nav-card--button .nav-card__background a { | ||
padding: 0; | padding: 0; | ||
} | } | ||
. | .nav-card--button img { | ||
transition: transform 0.3s ease; | transition: transform 0.3s ease; | ||
} | } | ||
. | .nav-card--button:hover img { | ||
transform: scale(1.05); | transform: scale(1.05); | ||
} | } | ||
2024年4月5日 (五) 14:56的版本
