[css-values-4] Define generic serialization for functional notations. w3c/csswg-drafts@05c815d

Author: triple-underscore

css-values-ja.html

@@ -128,6 +128,9 @@
 case 'U':
 	text = `U+${key}`
 	break;
+case 'smb':
+	text = `(<span class="char-symbol">${text}</span>)`;
+	break;
 case 'en':
 	return `<span lang="en">${key}</span>`
 	break;
@@ -173,8 +176,8 @@
 ●●options
 
 spec_title:CSS Values and Units Module Level 4
-spec_date:2026-05-12
-trans_update:2026-05-22
+spec_date:2026-06-24
+trans_update:2026-06-25
 source_checked:250605
 page_state_key:CSS
 original_url:https://drafts.csswg.org/css-values-4/
@@ -625,6 +628,10 @@
 	わたり:stretch across
 	裸の:naked
 	文法~上の:grammatical
+	記され:written
+	挟む:join
+	挟む:-
+	~semicolon:semi-colon
 
 	●layout / typeset
 	size:width and height／:widths and heights
@@ -709,6 +716,9 @@
 書字:writing::~
 	下位prop:longhand
 	色~channel:color-channel
+宣言d:declared::宣言
+色停:color-stop::~
+	色停:stop
 
 	●UI
 展開-:expand:~
@@ -1094,6 +1104,7 @@
 	同じ結果:identical to
 	不揃い:varying
 	他と合致しない:mismatched
+	から導出されるもの:derivative
 
 	●未分類
 覆う:coverする:~
@@ -1242,6 +1253,7 @@
 	上の〜:preceding
 	-:at-least
 	-:distinct
+	最後:final
 	最後に:finally
 	多い:many times
 	これまでの:earlier
@@ -1682,6 +1694,7 @@
 
 値~定義の構文:#css-value-definition-syntax
 関数-記法:#functional-notation
+関数-記法を直列化する:#serialize-a-functional-notation
 複化子:#component-multipliers
 結合子:#component-combinators
 ~textな~data型:#css-textual-data-types
@@ -1811,9 +1824,10 @@
 ~escape:~CSSSYN#escaping
 	~escape:~CSS22/syndata.html#escaped-characters
 
+宣言d値:~CASCADE#declared-value
+指定d値:~CASCADE#specified-value
 算出d値:~CASCADE#computed-value
 使用~値:~CASCADE#used-value
-指定d値:~CASCADE#specified-value
 実際の値:~CASCADE#actual-value
 初期~値:~CASCADE#initial-value
 解決d値:~CSSOM1#resolved-values
@@ -1872,6 +1886,8 @@
 
 既定の~anchor要素:~CSSANCHOR#default-anchor-element
 
+色停:~CSSIMAGE#color-stop
+
 	●外部（他
 
 実装定義:~INFRA#implementation-defined
@@ -1883,6 +1899,8 @@
 ~size:~INFRA#list-size
 付加する:~INFRA#list-append
 空にする:~INFRA#list-empty
+連結する:~INFRA#string-concatenate
+~ASCII小文字~化する:~INFRA#ascii-lowercase
 
 過去互換~mode:~DOM4#concept-document-quirks
 ~node~tree:~DOM4#concept-node-tree
@@ -7369,6 +7387,157 @@ <h2 title="Functional Notations">9. 関数-記法</h2>
 The math functions are defined below. Other functional notations are defined in their own modules; for example the &lt;color&gt; functions are defined in [CSS-COLOR-4] and [CSS-COLOR-5].
 </p>
 
+		<section id="fuctional-serialization">
+<h3 title="Serialization of Functional Notations">9.1. 関数-記法の直列化</h3>
+
+<p>
+`関数-記法$の直列化は、
+他が指定されない限り，
+`関数-記法を直列化する$ ~algoに従う。
+◎
+Unless otherwise specified,＼
+</p>
+
+<div class="algo">
+<p>
+`関数-記法を直列化する@
+~algoは、
+所与の
+( `関数-記法$ %関数 )
+に対し
+⇒
+~RET 次を順に`連結する$
+⇒＃
+`~ASCII小文字~化する$( %関数 の名前 ),
+`0028^U `(^smb,
+%関数 を成す引数たちを以下に従って直列化した結果,
+`0029^U `)^smb
+</p>
+
+<p>
+引数たちを直列化する際には：
+</p>
+<ul>
+	<li>
+［
+%関数 を成す各~引数を個々の文法に従って直列化した結果
+］を %関数 の文法に記された順序で`連結する$。
+</li>
+	<li>
+~spaceで分離される~tokenたちは 1 個の~space（ `0020^U `SPACE^cn ）で`連結する$。
+</li>
+	<li>
+直列化した結果を成す各［
+~comma, ~colon, ~semicolon, ~slash
+］の直後には 1 個の~space（ `0020^U `SPACE^cn ）を挟む。
+</li>
+	<li>
+`算出d値$や算出d値から導出されるもの（`指定d値$や`宣言d値$でないもの）を直列化する際には、
+省略しても意味が変化しない成分を省略する。
+</li>
+</ul>
+◎
+to serialize a functional notation:
+• Let s be a string containing the function’s name in lowercase, followed by “(” (U+0028 LEFT PARENTHESIS).
+• Append to s the serializations of the arguments of the functional notation per their individual grammars,＼
+in the order the grammars are written in,＼
+joining space-separated tokens with a single space,＼
+and following each serialized comma, colon, semi-colon, or slash with a single space (U+0020 SPACE).＼
+When serializing the computed value or its derivatives (not specified or declared values), omit components when possible without changing the meaning.
+• Append “)” (`0029^U  RIGHT PARENTHESIS) to s.
+</div>
+
+<p class="issue">
+`指定d値$がどう取扱われるかにおいて一貫でない。
+`9720$issue
+◎
+We are inconsistent in how we handled specified values. [Issue #9720]
+</p>
+
+<div class="example">
+<p>
+`LINEAR-GRADIENT( to bottom , red calc( 1em + 5% ) , green calc(130px / 2) , blue 100% )^v
+の様な関数を直列化した結果は：
+◎
+For example, given a function like LINEAR-GRADIENT( to bottom , red calc( 1em + 5% ) , green calc(130px / 2) , blue 100% ):
+</p>
+<ul>
+	<li>
+<p>
+`指定d値$としては
+⇒
+`linear-gradient(to bottom, red calc(5% + 1em), green calc(65px), blue 100%)^l
+◎
+as a specified value
+• it will serialize as  linear-gradient(to bottom, red calc(5% + 1em), green calc(65px), blue 100%)
+</p>
+
+<p>
+その際には：
+◎
+↓</p>
+		<ul>
+			<li>
+関数~名や`~keyword$は小文字~化される。
+◎
+• Function names and keywords become lowercase.
+</li>
+			<li>
+~tokenどうしの合間における空白~列は 1 個の~spaceに正規化されるが、
+次に挙げる箇所には~spaceを挟まない
+⇒＃
+左~丸括弧や左~角括弧の直後／
+右~丸括弧や右~角括弧の直前／
+~commaの直前
+◎
+• Whitespace is normalized: one space between most tokens, but no space after left parentheses/brackets, before right parentheses/brackets, or before commas
+</li>
+			<li>
+各 `calc$f 引数は、
+`§ 直列化＠#calc-serialize$ に従って，単純~化され, ~sortされる。
+◎
+• calc() arguments are simplified and sorted per § 10.13 Serialization
+</li>
+		</ul>
+	</li>
+	<li>
+<p>
+`算出d値$としては
+⇒
+`linear-gradient(red calc(5% + 16px), green calc(65px), blue)^l
+◎
+as a computed value
+• it will serialize as linear-gradient(red calc(5% + 16px), green calc(65px), blue)
+</p>
+
+<p>
+その際には、
+`指定d値$に適用される単純~化【や小文字~化その他】に加えて：
+◎
+• In addition to any specified value simplifications,＼
+</p>
+		<ul>
+			<li>
+追加的な値の算出
+— `指定d長さ$を`算出d長さ$へ変換するなど —
+があれば，それも適用される。
+◎
+• any additional value computations are also applied, such as converting specified lengths to computed lengths.
+</li>
+			<li>
+省略-時の既定に合致する値は、
+まるごと省略される
+（この例においては、
+`to bottom^v や最後の`色停$を成す位置 `100%^v ）。
+◎
+• Values that match the default (e.g. to bottom, the 100% stop position on the final stop) are omitted entirely.
+</li>
+		</ul>
+	</li>
+</ul>
+</div>
+
+		</section>
 	</section>
 	<section id="math">
 <h2 title="Mathematical Expressions">10. 数学的な式</h2>