css set variable
:root {
--main-bg-color: coral;
}
#div1 {
background-color: var(--main-bg-color);
}
#div2 {
background-color: var(--main-bg-color);
}css set variable
:root {
--main-bg-color: coral;
}
#div1 {
background-color: var(--main-bg-color);
}
#div2 {
background-color: var(--main-bg-color);
}variables css
:root {
--main-bg-color: brown;
}
.uno {
color: white;
background-color: var(--main-bg-color);
margin: 10px;
width: 50px;
height: 50px;
display: inline-block;
}css variables
/* "css variables" */
/* not for ie but good for Edge and other browser :D */
/*
By declaring a custom property on the :root pseudo-class
and using it where needed throughout the document
*/
: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;
}css variables
:root {
--blue: #1e90ff;
--white: #ffffff;
}
body { background-color: var(--blue); }
h2 { border-bottom: 2px solid var(--blue); }
.container {
color: var(--blue);
background-color: var(--white);
padding: 15px;
}
button {
background-color: var(--white);
color: var(--blue);
border: 1px solid var(--blue);
padding: 5px;
}css variable
...
<style>
:root{
--couleur-principale: brown;
}
#test1{
color:var(--couleur-principale);
}
</style>
...how to use variables in css
:root {
--clr-primary-1: hsl(205, 86%, 17%);
}
.container{
background-color: var(--clr-primary-3);
}Copyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us
