diff --git a/css/index.css b/css/index.css index 678bf57..e61672e 100644 --- a/css/index.css +++ b/css/index.css @@ -1154,7 +1154,7 @@ /* 竖向长方形卡片 */ .resolve-card { width: 150px; - height: 400px; + height: 500px; position: relative; overflow: hidden; transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1); @@ -1255,7 +1255,7 @@ transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1); z-index: 2; position: relative; - margin-top: 100px; + margin-top: 140px; } /* 内容区域 - 默认隐藏 */ @@ -1277,8 +1277,8 @@ .resolve-card-desc { color: rgba(203, 213, 225, 0.9); - line-height: 1.7; - font-size: 15px; + line-height: 1.8; + font-size: 14px; } .resolve-card-link { @@ -1316,9 +1316,10 @@ opacity: 1; } -/* 悬停时图片依然撑满宽度 */ +/* 悬停时图片高度展开 */ .resolve-card:hover .resolve-card-inner::after { width: 100%; + height: 140px; } /* 悬停时标题变为横向并移到图片下方 */ @@ -1327,7 +1328,7 @@ text-orientation: mixed; letter-spacing: 2px; position: absolute; - top: 100px; + top: 160px; left: 24px; right: 24px; margin-top: 0; @@ -1340,7 +1341,7 @@ .resolve-card:hover .resolve-card-content { opacity: 1; transform: translateY(0); - top: 150px; + top: 200px; } .resolve-card:hover .resolve-card-link { diff --git a/index.html b/index.html index 363714f..3b68aa8 100644 --- a/index.html +++ b/index.html @@ -251,7 +251,7 @@
查看详情
查看详情
查看详情
查看详情
查看详情
查看详情
查看详情