mirror of
https://github.com/eternity4719/HowToLiveBetter.git
synced 2026-10-28 19:54:50 +08:00
43 lines
2.9 KiB
HTML
43 lines
2.9 KiB
HTML
<!-- og.png 的源文件。数字由 node tools/sync-stats.mjs 回写，同一条命令顺带重新截图。
|
|
三个数字的口径：条目数、A 级条数取自 README 正文（不含「怎么读」示例块里的那条），
|
|
链接数 = 所有「- 来源：」和「- 备注：」行里的 http(s) 链接总数。 -->
|
|
<!doctype html><meta charset="utf-8">
|
|
<style>
|
|
*{margin:0;padding:0;box-sizing:border-box}
|
|
body{width:1200px;height:630px;font-family:"Microsoft YaHei","PingFang SC",sans-serif;
|
|
background:#fff;position:relative;overflow:hidden}
|
|
.bg{position:absolute;inset:0;
|
|
background:radial-gradient(700px 420px at 88% 8%, rgba(100,108,255,.16), transparent 70%),
|
|
radial-gradient(560px 380px at 4% 100%, rgba(16,185,129,.12), transparent 70%)}
|
|
.grid{position:absolute;inset:0;opacity:.5;
|
|
background-image:linear-gradient(#eceded 1px,transparent 1px),linear-gradient(90deg,#eceded 1px,transparent 1px);
|
|
background-size:48px 48px;
|
|
-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.55),transparent 78%)}
|
|
.in{position:relative;padding:76px 84px;height:100%;display:flex;flex-direction:column}
|
|
.brand{display:flex;align-items:center;gap:14px;font-size:23px;color:#3c3c43b8;font-weight:600;letter-spacing:.02em}
|
|
.logo{width:44px;height:44px;border-radius:11px;background:#3451b2;color:#fff;font-size:26px;font-weight:700;
|
|
display:flex;align-items:center;justify-content:center}
|
|
.logo svg{width:28px;height:28px}
|
|
h1{margin-top:56px;font-size:82px;line-height:1.12;letter-spacing:-.02em;color:#1b1b1f;font-weight:700}
|
|
h1 em{font-style:normal;color:#3451b2}
|
|
p{margin-top:26px;font-size:30px;white-space:nowrap;line-height:1.6;color:#3c3c43c7;max-width:960px}
|
|
.chips{margin-top:auto;margin-bottom:8px;display:flex;gap:14px;flex-wrap:wrap}
|
|
.c{font-size:24px;font-weight:600;padding:12px 22px;border-radius:999px;background:#f6f6f7;color:#3c3c43c7;border:1px solid #e2e2e3}
|
|
.c b{color:#1b1b1f}
|
|
.c.a{background:rgba(16,185,129,.12);border-color:transparent;color:#18794e}
|
|
.c.u{background:rgba(100,108,255,.14);border-color:transparent;color:#3451b2}
|
|
.bar{position:absolute;left:0;top:0;width:100%;height:8px;background:linear-gradient(90deg,#3451b2,#5672cd 45%,#18794e)}
|
|
</style>
|
|
<div class="bg"></div><div class="grid"></div><div class="bar"></div>
|
|
<div class="in">
|
|
<div class="brand"><span class="logo" aria-hidden="true"><svg viewBox="0 0 24 24"><path d="M6 12.5l4 4 8-9.5" fill="none" stroke="currentColor" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"/></svg></span>高性价比人生指南</div>
|
|
<h1>用最少的钱、时间和精力，<br>换回<em>寿命、金钱和自由</em></h1>
|
|
<p>长寿防病 · 急救 · 省钱理财 · 法律红线 · 失业兜底 · 恋爱婚育 · 出国 · 技能</p>
|
|
<div class="chips">
|
|
<div class="c u"><b>767</b> 条建议</div>
|
|
<div class="c a">A 级证据 <b>495</b> 条</div>
|
|
<div class="c"><b>2531</b> 条原始文献链接</div>
|
|
<div class="c">可按性价比筛选</div>
|
|
</div>
|
|
</div>
|