CSS vars
Variables - proměnné v CSSku
Syntax nastavení proměnné: --muj-nazev: hodnota;
Globální proměnné lze nastavit v pseudo třídě :root
Syntax přístupu k proměnné: var(--muj-nazev);
Editor
Pro živou ukázku je CSS a JavaScript vepsaný přímo v dokumentu - v praxi tyto soubory vždy oddělujte do externích souborů
<!DOCTYPE html>
<html>
<head>
<style>
:root {
--div-color: red;
}
div {
--text-color: green;
background: var(--div-color);
width: 200px;
height: 200px;
color: var(--text-color);
border: 5px solid var(--text-color);
border-radius: 8px;
border-top-left-radius: 62px;
border-bottom-right-radius: 24px;
opacity: 0.5;
}
</style>
</head>
<body>
<div>
ahoj lol
</div>
</body>
</html>