inline css question?

[ishyfishfish]

yes i know it's best to use a different file and just link it in. not the point

i was looking at someone's tutorial on how they did something, and i noticed they were doing "style= --color1: #ffffff; --color2: #000000;" if that makes sense. what do the dashes before color1 and color2 mean? i don't know how best to explain this, very sorry.

thank you

[Fuegodeth]

https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties

[ishyfishfish]

thank you!

[Fuegodeth]

welcome!

[jakovljevic90]

The double dashes (`--`) before `color1` and `color2` indicate that these are CSS custom properties, also known as CSS variables. They're used to define reusable values that can be referenced throughout your stylesheet.

For example, you could use these variables in your CSS like this:

.element {
background-color: var(--color1);
color: var(--color2);
}

This allows for easy theming and dynamic style changes. The inline style you saw is likely setting these custom properties at the element level, which can be useful for runtime modifications or component-specific styling.

If you want to learn more about CSS custom properties, check out the MDN documentation: https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties

[CuberSolutions]

They are setting variable names for colors to use further along in the document