@@ -354,20 +354,8 @@ to full URLs as described in [[!css3-values]].
354
354
355
355
</div>
356
356
357
-
358
- Fallbacks In ''var()'' References {#fallbacks-in-var-references}
359
- ----------------------------------------------------------------
360
-
361
- References to registered custom properties using the ''var()'' function may
362
- provide a fallback. However, the fallback value must match the
363
- <a>syntax definition</a> of the custom property being referenced, otherwise the
364
- declaration is <a spec=css-variables>invalid at computed-value time</a> .
365
-
366
- Note: This applies regardless of whether or not the fallback is being used.
367
-
368
-
369
- Substitution {#substitution}
370
- ----------------------------
357
+ Substitution via ''var()'' {#substitution}
358
+ ------------------------------------------
371
359
372
360
Like unregistered custom properties,
373
361
the value of a registered custom property can be substituted into another value with the ''var()'' function.
@@ -396,12 +384,19 @@ and [[css-syntax-3#tokenization|tokenizing]] the resulting string.
396
384
Because the computed value of '--x' (when serialized) is "80px",
397
385
the computed value of '--y' is
398
386
a <<dimension-token>> with a value of "80" and unit "px".
399
-
400
387
</div>
401
388
389
+ ### Fallbacks In ''var()'' References ### {#fallbacks-in-var-references}
390
+
391
+ References to registered custom properties using the ''var()'' function may
392
+ provide a fallback. However, the fallback value must match the
393
+ <a>syntax definition</a> of the custom property being referenced, otherwise the
394
+ declaration is <a spec=css-variables>invalid at computed-value time</a> .
395
+
396
+ Note: This applies regardless of whether or not the fallback is being used.
397
+
402
398
403
- Dependency Cycles Via Relative Units {#dependency-cycles}
404
- ---------------------------------------------------------
399
+ ### Dependency Cycles via Relative Units ### {#dependency-cycles}
405
400
406
401
[=Registered custom properties=] follow the same rules for dependency cycle resolution
407
402
as unregistered [=custom properties=] ,
@@ -586,8 +581,8 @@ If the above conditions are not met, the ''@property'' rule is invalid.
586
581
██████ ██████
587
582
-->
588
583
589
- Registering Custom Properties {#registering-custom-properties}
590
- ==============================================================
584
+ Registering Custom Properties in JS {#registering-custom-properties}
585
+ ====================================================================
591
586
592
587
To register a custom property via JS,
593
588
the {{CSS}} object is extended with a {{registerProperty()}} method:
0 commit comments