Add reference for fractional.

docs/styles/css_units/fractional.md

@@ -0,0 +1,28 @@
+# Fractional
+
+## Syntax
+
+--8<-- "docs/styles/snippets/fractional_syntax.md"
+
+!!! warning
+
+    Not to be confused with the [percentage](./percentage.md) unit nor with the [scalar](./scalar.md) unit.
+
+## Examples
+
+```css
+Widget {
+    text-opacity: 0.45;
+    text-opacity: 45%;
+}
+```
+
+```py
+widget.styles.text_opacity = 0.45
+widget.styles.text_opacity = "45%"
+```
+
+## Used by
+
+ - [`opacity`](../opacity.md)
+ - [`text-opacity`](../text_opacity.md)

docs/styles/css_units/index.md

@@ -5,6 +5,7 @@ Many CSS rules accept units of some sort, as opposed to a set of values.
 The different CSS units are:
 
  - [color](./color.md) – e.g., to set the [background color](../background.md);
+ - [fractional](./fractional.md) – e.g., to set a widget's [`opacity`](../opacity.md);
  - [integer](./integer.md) – e.g., to set the [`grid-size`](../grid/grid_size.md);
  - [percentage](./percentage.md) – e.g., to set the transparency of the [background color](../background.md); and
  - [scalar](./scalar.md) – e.g., to set the [width](../width.md) of a widget.

docs/styles/snippets/fractional_syntax.md

@@ -0,0 +1,6 @@
+A fractional value can be set to
+
+ - a float between 0 and 1 (e.g., `0.45`); or
+ - a percentage between 0% and 100% (e.g., `45%`).
+
+Values outside their ranges will be clamped.

mkdocs.yml

@@ -57,6 +57,7 @@ nav:
       - CSS units:
         - "styles/css_units/index.md"
         - "styles/css_units/color.md"
+        - "styles/css_units/fractional.md"
         - "styles/css_units/integer.md"
         - "styles/css_units/percentage.md"
         - "styles/css_units/scalar.md"