using var in css code example
Example 1: css set variable
:root {
--main-bg-color: coral;
}
#div1 {
background-color: var(--main-bg-color);
}
#div2 {
background-color: var(--main-bg-color);
}
Example 2: css variable
:root {
--main-bg-color: pink;
}
body {
background-color: var(--main-bg-color);
}
Example 3: create variable in css
:root {
--tab-count: 5;
}
#div1 {
width: calc(100% - var(--tab-count));
}
Example 4: css variables
:root {
--primary-bg: #8a2be2;
--btn-font-size: 18px;
--btn-padding: 10px 15px;
}
.btn-primary {
background-color: var(--primary);
font-size: var(--btn-font-size);
padding: var(--btn-padding);
color: #E2E2E2;
}
Example 5: css variable
...
<style>
:root{
--couleur-principale: brown;
}
#test1{
color:var(--couleur-principale);
}
</style>
...