fix(ui): 首页刊头插画锚定 1180px 内容列右缘,位置不随窗口宽度漂移

This commit is contained in:
wanghu
2026-10-23 09:13:44 +08:00
parent 0046b3a87f
commit 3d641c87f4
+2 -1
View File
@@ -152,7 +152,8 @@ ul, ol { list-style: none; }
.htxt b { font-family: var(--font-b); font-size: 21px; font-weight: 800; display: block; color: #1e63c8; line-height: 1.2; } .htxt b { font-family: var(--font-b); font-size: 21px; font-weight: 800; display: block; color: #1e63c8; line-height: 1.2; }
.htxt span { display: block; margin-top: 2px; font-size: 11px; color: #5b7ba1; letter-spacing: .5px; } .htxt span { display: block; margin-top: 2px; font-size: 11px; color: #5b7ba1; letter-spacing: .5px; }
.hero-grid { display: none; } .hero-grid { display: none; }
.hero-illo { position: absolute; right: 200px; top: 55px; height: 250px; object-fit: contain; mix-blend-mode: multiply; z-index: 1; -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 22%, #000 84%, transparent 100%); mask-image: linear-gradient(180deg, transparent 0, #000 22%, #000 84%, transparent 100%); } /* 插画锚定 1180px 内容列右缘(right:50%-590px),位置不随窗口宽度漂移 */
.hero-illo { position: absolute; right: calc(50% - 590px); top: 55px; height: 250px; object-fit: contain; mix-blend-mode: multiply; z-index: 1; -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 22%, #000 84%, transparent 100%); mask-image: linear-gradient(180deg, transparent 0, #000 22%, #000 84%, transparent 100%); }
/* ===== 栏目条:现代胶囊式 ===== */ /* ===== 栏目条:现代胶囊式 ===== */
.module-bar { margin-top: 14px; display: flex; align-items: center; border-radius: 10px; background: var(--card); box-shadow: var(--shadow-sm); padding: 4px 6px; } .module-bar { margin-top: 14px; display: flex; align-items: center; border-radius: 10px; background: var(--card); box-shadow: var(--shadow-sm); padding: 4px 6px; }