diff options
Diffstat (limited to 'Base/res/html/misc/custom-properties.html')
| -rw-r--r-- | Base/res/html/misc/custom-properties.html | 68 |
1 files changed, 68 insertions, 0 deletions
diff --git a/Base/res/html/misc/custom-properties.html b/Base/res/html/misc/custom-properties.html new file mode 100644 index 0000000000..87c341e85c --- /dev/null +++ b/Base/res/html/misc/custom-properties.html @@ -0,0 +1,68 @@ +<!DOCTYPE html> +<html> + +<head> + <title>Custom Properties</title> + <style> + :root { + --my-color: purple; + } + + div { + margin: 20px; + } + + .test { + background: var(--my-color); + } + + .test-parent { + --my-color: pink; + border: 1px solid black; + } + + .box { + width: 150px; + height: 150px; + border: 1px solid black; + } + </style> +</head> + +<body> + <h1>CSS Custom Properties</h1> + <pre> + :root { + --my-color: purple; + } + + .test { + background: var(--my-color); + } + + .test-parent { + --my-color: pink; + } + + </pre> + <div class="box test"> + <pre> + .test + </pre> + This should be purple + </div> + + <div class="test-parent"> + <pre> + .test-parent + </pre> + <div class="box test"> + <pre> + .test + </pre> + This should be pink + </div> + </div> +</body> + +</html> |