docs: 字型交消費端（同步 main 之 _lang.css 移除）
changelog 增「變更：字型移出聚珍管理」（不內建 font-family、半形顯式保留 locl、 render 不改 lang；halt／margin 兩模式驗證正常）。使用文檔 CSS 基礎設定「字型」項 改寫為「字型由消費端負責」＋推薦逐 lang 範式。HTML 與 Markdown 孿生同步、manifest 重建。
This commit is contained in:
+26
-14
@@ -1,4 +1,4 @@
|
||||
<!-- built with theme=dracula, mode=report, at=2026-06-02T16:59:45Z -->
|
||||
<!-- built with theme=dracula, mode=report, at=2026-06-02T18:02:11Z -->
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-Hant">
|
||||
<head>
|
||||
@@ -2553,6 +2553,11 @@ main > *:nth-child(n+6) { animation-delay: 0.46s; }
|
||||
<li><strong>標點誤隙</strong>：全角省略號 …… 後接 CJK 不再誤補隙（<code>DOTS_CJK</code> 移除 <code>|…</code>）；收尾彎引號 ” 後接拉丁／數字不再補隙（移除 pangu <code>QUOTE_AN</code> 偏例，與 」』）》】〕 等所有收尾標點一致）。全部常用中文標點 × 簡繁共 104 例稽核，CJK 間皆 0 誤隙。</li>
|
||||
</ul>
|
||||
|
||||
<h3>變更</h3>
|
||||
<ul>
|
||||
<li><strong>字型移出聚珍管理</strong>：字型屬消費端領域，聚珍不再內建任何 <code>font-family</code>／字型堆疊（移除 <code>_lang.css</code>，<code>dist/juzhen.css</code> 零字型規則）。逐語言字型完全由消費端 CSS 設定（範式見文檔「字型與 locl」）。聚珍僅守三項非管理性本分：<code>jz-* { font: inherit }</code> 使原子繼承消費端字型、不強加；半形 <code>font-feature-settings</code> 顯式併入 <code>"locl" 1</code>（連同 <code>halt</code>）確保泛 CJK 字型之地域標點字形不因設 halt 而失；render 只讀不改 <code>lang</code>。halt／margin 兩模式皆已驗證字型繼承與 locl 正常。</li>
|
||||
</ul>
|
||||
|
||||
<h3>工具</h3>
|
||||
<ul>
|
||||
<li><strong><code>demo/resize-check.html</code></strong>：可拖曳容器檢查頁——拖動方框寬度，驗證中西間隙在各寬度下恆穩、標點無誤隙；可切 <code>justify</code> 與「顯示間隙」描邊。</li>
|
||||
@@ -2650,6 +2655,9 @@ main > *:nth-child(n+6) { animation-delay: 0.46s; }
|
||||
- 中西間隙西文集完整化：補貨幣（€ 等）、拉丁擴充 A/B（拼音 ā ǎ ē）、西里爾、數學運算符，希臘補全至 α-ω。列舉法 \uXXXX、無需 flag、相容 2016。
|
||||
- 標點誤隙：…… 後接 CJK 不誤補（DOTS_CJK 去 |…）；收尾彎引號 ” 後接拉丁／數字不補（移除 pangu QUOTE_AN 偏例）。中文標點 × 簡繁 104 例稽核皆 0 誤隙。
|
||||
|
||||
### 變更
|
||||
- 字型移出聚珍管理：不再內建 font-family／字型堆疊（移除 _lang.css）；逐語言字型交消費端 CSS（範式見文檔「字型與 locl」）。聚珍僅守：jz-* font:inherit 繼承消費端字型、半形 font-feature 顯式併 locl（連同 halt）、render 不改 lang。halt／margin 兩模式字型繼承與 locl 皆驗證正常。
|
||||
|
||||
### 工具
|
||||
- demo/resize-check.html：可拖曳容器檢查頁（各寬度間隙穩定性、標點無誤隙）。
|
||||
|
||||
@@ -3198,8 +3206,9 @@ var Juzhen = (() => {
|
||||
var ALNUM = "A-Za-z0-9";
|
||||
var ALPHA = "A-Za-z";
|
||||
var ANY_CJK = new RegExp("[" + CJK + "]");
|
||||
var ANS_AFTER_CJK = ALPHA + "\u0370-\u03FF0-9@\\$%\\^&\\*\\-\\+\\\\=\xA1-\xB6\xB8-\xFF\u2150-\u218F\u2700-\u27BF";
|
||||
var ANS_BEFORE_CJK = ALPHA + "\u0370-\u03FF0-9\\$%\\^&\\*\\-\\+\\\\=\xA1-\xB6\xB8-\xFF\u2150-\u218F\u2700-\u27BF";
|
||||
var WEST_SHARED = "0-9\\$%\\^&\\*\\-\\+\\\\=\\u0370-\\u03ff\\u0100-\\u024f\\u0400-\\u04ff\\u00a1-\\u00b6\\u00b8-\\u00ff\\u20a0-\\u20bf\\u2150-\\u21ff\\u2200-\\u22ff\\u2700-\\u27bf";
|
||||
var ANS_AFTER_CJK = ALPHA + "@" + WEST_SHARED;
|
||||
var ANS_BEFORE_CJK = ALPHA + WEST_SHARED;
|
||||
var BD_STOP = "\u3002\uFF01\uFF1F";
|
||||
var BD_PAUSE = "\uFF0C\u3001\uFF1B\uFF1A";
|
||||
var BD_OPEN = "\u300C\u300E\uFF08\u300A\u3008\u3010\u3016\u3014\uFF3B\uFF5B\u201C\u2018";
|
||||
@@ -3622,6 +3631,10 @@ var Juzhen = (() => {
|
||||
const rects = el.getClientRects();
|
||||
return rects.length ? rects[0] : null;
|
||||
}
|
||||
function lastRect(el) {
|
||||
const rects = el.getClientRects();
|
||||
return rects.length ? rects[rects.length - 1] : null;
|
||||
}
|
||||
function relayout(root, finder) {
|
||||
root.querySelectorAll("jz-char." + LE).forEach((e) => e.classList.remove(LE));
|
||||
const chars = Array.from(root.querySelectorAll("jz-char")).filter(
|
||||
@@ -3670,18 +3683,19 @@ var Juzhen = (() => {
|
||||
};
|
||||
var TRIM = "jz-hws-trim";
|
||||
function trimGaps(root, finder) {
|
||||
root.querySelectorAll("jz-hws." + TRIM).forEach((e) => e.classList.remove(TRIM));
|
||||
const gaps = Array.from(root.querySelectorAll("jz-hws")).filter(
|
||||
(g) => finder.inScope(g) && !finder.isAvoided(g)
|
||||
);
|
||||
if (!gaps.length) {
|
||||
return;
|
||||
}
|
||||
gaps.forEach((g) => g.classList.add(TRIM));
|
||||
for (const g of gaps) {
|
||||
const r = firstRect(g);
|
||||
if (!r) {
|
||||
continue;
|
||||
}
|
||||
const next = edgeRect(g.nextSibling, "next", g);
|
||||
if (!next || next.top > r.top + EPS) {
|
||||
g.classList.add(TRIM);
|
||||
const r = lastRect(g);
|
||||
const next = r ? edgeRect(g.nextSibling, "next", g) : null;
|
||||
const atLineEnd = !r || !next || next.top > r.top + EPS;
|
||||
if (!atLineEnd) {
|
||||
g.classList.remove(TRIM);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -3772,7 +3786,7 @@ var Juzhen = (() => {
|
||||
var STRIP_CJK_SPACE_ANS = new RegExp("([" + CJK + "]) ([" + ANS_AFTER_CJK + "])", "g");
|
||||
var STRIP_ANS_SPACE_CJK = new RegExp("([" + ANS_BEFORE_CJK + "]) ([" + CJK + "])", "g");
|
||||
var STRIP_CJK_SPACE_CJK = new RegExp("([" + CJK + "]) (?=[" + CJK + "])", "g");
|
||||
var DOTS_CJK = new RegExp("([\\.]{2,}|\u2026)([" + CJK + "])", "g");
|
||||
var DOTS_CJK = new RegExp("([\\.]{2,})([" + CJK + "])", "g");
|
||||
var CJK_PUNCTUATION = new RegExp("([" + CJK + "])([!;,\\?:]+)(?=[" + CJK + ALNUM + "])", "g");
|
||||
var AN_PUNCTUATION_CJK = new RegExp("([" + ALNUM + "])([!;,\\?]+)([" + CJK + "])", "g");
|
||||
var CJK_TILDE = new RegExp("([" + CJK + "])(~+)(?!=)(?=[" + CJK + ALNUM + "])", "g");
|
||||
@@ -3782,7 +3796,6 @@ var Juzhen = (() => {
|
||||
var AN_COLON_CJK = new RegExp("([" + ALNUM + "])(:)([" + CJK + "])", "g");
|
||||
var CJK_QUOTE = new RegExp("([" + CJK + "])([" + QUOTES_CLS + "])", "g");
|
||||
var QUOTE_CJK = new RegExp("([" + QUOTES_CLS + "])([" + CJK + "])", "g");
|
||||
var QUOTE_AN = new RegExp("([\u201D])([" + ALNUM + "])", "g");
|
||||
var CJK_QUOTE_AN = new RegExp("([" + CJK + '])(")([' + ALNUM + "])", "g");
|
||||
var CJK_HASH = new RegExp("([" + CJK + "])(#([^ ]))", "g");
|
||||
var HASH_CJK = new RegExp("(([^ ])#)([" + CJK + "])", "g");
|
||||
@@ -3820,7 +3833,6 @@ var Juzhen = (() => {
|
||||
s = s.replace(AN_COLON_CJK, "$1$2" + MARK + "$3");
|
||||
s = s.replace(CJK_QUOTE, "$1" + MARK + "$2");
|
||||
s = s.replace(QUOTE_CJK, "$1" + MARK + "$2");
|
||||
s = s.replace(QUOTE_AN, "$1" + MARK + "$2");
|
||||
s = s.replace(CJK_QUOTE_AN, "$1$2" + MARK + "$3");
|
||||
s = s.replace(CJK_HASH, "$1" + MARK + "$2");
|
||||
s = s.replace(HASH_CJK, "$1" + MARK + "$3");
|
||||
|
||||
@@ -36,6 +36,11 @@
|
||||
<li><strong>標點誤隙</strong>：全角省略號 …… 後接 CJK 不再誤補隙（<code>DOTS_CJK</code> 移除 <code>|…</code>）；收尾彎引號 ” 後接拉丁／數字不再補隙（移除 pangu <code>QUOTE_AN</code> 偏例，與 」』）》】〕 等所有收尾標點一致）。全部常用中文標點 × 簡繁共 104 例稽核，CJK 間皆 0 誤隙。</li>
|
||||
</ul>
|
||||
|
||||
<h3>變更</h3>
|
||||
<ul>
|
||||
<li><strong>字型移出聚珍管理</strong>：字型屬消費端領域，聚珍不再內建任何 <code>font-family</code>／字型堆疊（移除 <code>_lang.css</code>，<code>dist/juzhen.css</code> 零字型規則）。逐語言字型完全由消費端 CSS 設定（範式見文檔「字型與 locl」）。聚珍僅守三項非管理性本分：<code>jz-* { font: inherit }</code> 使原子繼承消費端字型、不強加；半形 <code>font-feature-settings</code> 顯式併入 <code>"locl" 1</code>（連同 <code>halt</code>）確保泛 CJK 字型之地域標點字形不因設 halt 而失；render 只讀不改 <code>lang</code>。halt／margin 兩模式皆已驗證字型繼承與 locl 正常。</li>
|
||||
</ul>
|
||||
|
||||
<h3>工具</h3>
|
||||
<ul>
|
||||
<li><strong><code>demo/resize-check.html</code></strong>：可拖曳容器檢查頁——拖動方框寬度，驗證中西間隙在各寬度下恆穩、標點無誤隙；可切 <code>justify</code> 與「顯示間隙」描邊。</li>
|
||||
@@ -117,6 +122,9 @@
|
||||
- 中西間隙西文集完整化：補貨幣（€ 等）、拉丁擴充 A/B（拼音 ā ǎ ē）、西里爾、數學運算符，希臘補全至 α-ω。列舉法 \uXXXX、無需 flag、相容 2016。
|
||||
- 標點誤隙：…… 後接 CJK 不誤補（DOTS_CJK 去 |…）；收尾彎引號 ” 後接拉丁／數字不補（移除 pangu QUOTE_AN 偏例）。中文標點 × 簡繁 104 例稽核皆 0 誤隙。
|
||||
|
||||
### 變更
|
||||
- 字型移出聚珍管理：不再內建 font-family／字型堆疊（移除 _lang.css）；逐語言字型交消費端 CSS（範式見文檔「字型與 locl」）。聚珍僅守：jz-* font:inherit 繼承消費端字型、半形 font-feature 顯式併 locl（連同 halt）、render 不改 lang。halt／margin 兩模式字型繼承與 locl 皆驗證正常。
|
||||
|
||||
### 工具
|
||||
- demo/resize-check.html：可拖曳容器檢查頁（各寬度間隙穩定性、標點無誤隙）。
|
||||
|
||||
|
||||
+157
-50
File diff suppressed because one or more lines are too long
+3
-3
@@ -137,10 +137,10 @@ createJuzhen({ lang: { default: "zh-Hant" } }).render(document.querySelector("ma
|
||||
<ol>
|
||||
<li><strong>引入樣式（必須）</strong>：<code><link rel="stylesheet" href="dist/juzhen.css"></code>（或 ESM <code>import "cjk-autospace/css"</code>）。</li>
|
||||
<li><strong>設定 <code>lang</code>（強烈建議）</strong>：內容容器標 <code>lang="zh-Hans"</code>／<code>"zh-Hant"</code>／<code>"ja"</code>，驅動全角／開明政策與字形 <code>locl</code>。</li>
|
||||
<li><strong>作用域類</strong>：若設 <code>scope.include: ".juzhen"</code>，須給內容容器加對應 class；<code>juzhen.css</code> 之 normalize／字型堆疊亦收斂於此域。</li>
|
||||
<li><strong>作用域類</strong>：若設 <code>scope.include: ".juzhen"</code>，須給內容容器加對應 class；<code>juzhen.css</code> 之 normalize 亦收斂於此域。</li>
|
||||
<li><strong>長英文詞斷字</strong>：須由消費端 CSS 提供 <code>hyphens: auto</code>（含 <code>-webkit-hyphens</code>）。</li>
|
||||
<li><strong><code>justify</code>（選用）</strong>：欲兩端對齊則自設 <code>text-align: justify</code>；句末標點單份間距與行末去隙由聚珍處理。</li>
|
||||
<li><strong>字型（影響擠壓）</strong>：半形預設依字型 <code>halt</code>；含 <code>halt</code> 字型（Noto CJK／思源）即可，缺則用 <code>margin</code> 後備。<code>juzhen.css</code> 內建依 <code>:lang</code> 之 Noto CJK 字型堆疊，但<strong>僅作後備</strong>（全包 <code>:where()</code> 零特異度、只命中帶 <code>lang</code> 屬性之元素、不直接覆寫標點字面容器）——<strong>消費端 <code>font-family</code> 恆優先</strong>，標點亦隨之以消費端字型渲染。</li>
|
||||
<li><strong>字型由消費端負責</strong>：聚珍<strong>不</strong>內建任何 <code>font-family</code>／字型堆疊——逐語言字型完全由消費端 CSS 決定（推薦範式：逐 <code>lang</code> 設於 <code>.juzhen</code> 或帶 <code>lang</code> 之容器，<strong>勿</strong>直接設 <code>jz-inner</code>）。聚珍僅以 <code>jz-* { font: inherit }</code> 使原子繼承消費端字型、不強加，並顯式保留 <code>locl</code>（不改寫 <code>lang</code>、不關閉 locl，故正確標 <code>lang</code> ＋ 用支援 locl 之字型即正常）。半形擠壓依字型 OpenType <code>halt</code>；缺 <code>halt</code> 之字型須用 <code>jiya.halfWidth:"margin"</code> ＋按字型以 <code>jiya.bias</code> 微調。</li>
|
||||
<li><strong>自動處理</strong>：<code>juzhen.css</code> 已於 <code>.juzhen</code> 範圍內以 <code>@supports</code> 關閉 Blink 原生 <code>text-spacing-trim</code>／<code>text-autospace</code>，並令注入間隙 <code>user-select: none</code>（複製乾淨）。</li>
|
||||
<li><strong>段落屬性照常設、原子透明</strong>：聚珍把標點拆成 <code>inline-block</code> 原子，但已確保原子對消費端段落樣式透明——段落可正常設 <code>text-indent</code>（首行縮排）、<code>hanging-punctuation</code>、<code>text-decoration</code>（下劃線）等。庫內已歸零會被原子重複套用之繼承屬性、並令原子承接段落裝飾，故首行縮排正常、下劃線連續不斷，<strong>無需任何額外配置</strong>。</li>
|
||||
</ol>
|
||||
@@ -205,7 +205,7 @@ JS 只注入 `jz-*` 結構，所有視覺尺寸在 juzhen.css，缺一不可。
|
||||
|
||||
## CSS 基礎設定
|
||||
|
||||
引入 juzhen.css（必須）；設 lang；scope class；hyphens:auto；text-align:justify（選用）；含 halt 字型或 margin 後備。juzhen.css 之 Noto 字型堆疊僅作後備，消費端 font-family 恆優先。段落屬性照常設、原子透明：text-indent／hanging-punctuation／text-decoration 等已由庫內統一處理（歸零過套用、令原子承接段落裝飾），首行縮排正常、下劃線連續，無需額外配置。
|
||||
引入 juzhen.css（必須）；設 lang；scope class；hyphens:auto；text-align:justify（選用）。字型由消費端負責：聚珍不內建 font-family，逐語言字型自設於 .juzhen 或帶 lang 之容器（含 halt 字型，缺則 margin 後備＋bias）；聚珍以 font:inherit 繼承消費端字型、顯式保留 locl（正確標 lang ＋ 支援 locl 之字型即正常）。段落屬性照常設、原子透明：text-indent／hanging-punctuation／text-decoration 等已由庫內統一處理（歸零過套用、令原子承接段落裝飾），首行縮排正常、下劃線連續，無需額外配置。
|
||||
|
||||
## 分頁器相容
|
||||
|
||||
|
||||
Reference in New Issue
Block a user