perf: 优化字体加载性能和字间距
- 添加 adjustFontFallback: false 优化 CLS(累积布局偏移) - 调整霞鹜文楷字间距:从负值改为正值,让手写风格字体更自然 - h1: -0.03em → 0.01em - h2: -0.02em → 0.015em - type-display: 添加 0.01em - type-title: 0.02em → 0.025em - 改善字体加载时的视觉稳定性 Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -18,6 +18,7 @@ const lxgwWenKai = LXGW_WenKai_TC({
|
||||
variable: '--font-serif-cn',
|
||||
display: 'swap',
|
||||
preload: true,
|
||||
adjustFontFallback: false, // 中文字体不需要 fallback 调整,使用系统字体作为 fallback
|
||||
});
|
||||
|
||||
export const metadata: Metadata = {
|
||||
|
||||
@@ -219,7 +219,7 @@ body {
|
||||
line-height: 1.25;
|
||||
color: var(--color-ink-strong);
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.03em;
|
||||
letter-spacing: 0.01em; /* 手写风格字体需要稍微增加字间距 */
|
||||
font-family: var(--font-serif-cn), var(--font-serif-eng), "Songti SC", serif;
|
||||
}
|
||||
|
||||
@@ -228,7 +228,7 @@ body {
|
||||
line-height: 1.3;
|
||||
color: var(--color-ink-strong);
|
||||
font-weight: 600;
|
||||
letter-spacing: -0.02em;
|
||||
letter-spacing: 0.015em; /* 手写风格字体需要稍微增加字间距 */
|
||||
font-family: var(--font-serif-cn), var(--font-serif-eng), "Songti SC", serif;
|
||||
}
|
||||
|
||||
@@ -410,6 +410,7 @@ body {
|
||||
line-height: 1.2;
|
||||
font-weight: var(--font-weight-semibold);
|
||||
font-family: var(--font-serif-cn), var(--font-serif-eng), "Songti SC", serif;
|
||||
letter-spacing: 0.01em; /* 手写风格字体需要稍微增加字间距 */
|
||||
}
|
||||
|
||||
.type-title {
|
||||
@@ -417,7 +418,7 @@ body {
|
||||
line-height: 1.3;
|
||||
font-weight: var(--font-weight-semibold);
|
||||
font-family: var(--font-serif-cn), var(--font-serif-eng), "Songti SC", serif;
|
||||
letter-spacing: 0.02em;
|
||||
letter-spacing: 0.025em; /* 手写风格字体需要稍微增加字间距 */
|
||||
}
|
||||
|
||||
.type-subtitle {
|
||||
@@ -425,7 +426,7 @@ body {
|
||||
line-height: 1.35;
|
||||
font-weight: var(--font-weight-medium);
|
||||
font-family: var(--font-serif-cn), var(--font-serif-eng), "Songti SC", serif;
|
||||
letter-spacing: 0.02em;
|
||||
letter-spacing: 0.02em; /* 保持原有字间距 */
|
||||
}
|
||||
|
||||
.type-body {
|
||||
@@ -442,13 +443,13 @@ body {
|
||||
|
||||
h1 {
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.03em;
|
||||
letter-spacing: 0.01em; /* 手写风格字体需要稍微增加字间距 */
|
||||
font-family: var(--font-serif-cn), var(--font-serif-eng), "Songti SC", serif;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-weight: 600;
|
||||
letter-spacing: -0.02em;
|
||||
letter-spacing: 0.015em; /* 手写风格字体需要稍微增加字间距 */
|
||||
font-family: var(--font-serif-cn), var(--font-serif-eng), "Songti SC", serif;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user