I’m a bit confused by the orange text in HTML and what it actually means. For example:
< div class=“marker” > —If I understand correctly I can change the marker to any name I want, as long as I also change it in CSS as well. (I could change the marker name to pen, color, paint, etc and it would act the exact same)
But with:
< meta charset=“utf-8” > — utf-8 seems to be a pre-determined character set, which I can not change?
Same in the styles.CSS — .marker { margin: 10px auto; } — auto seems to be a pre-determined function and not a random name I can give it.
Can someone explain if there is a difference, and why all 3 examples (“marker”, “utf-8” and ‘auto’) are orange in HTML-CSS?
I think you’re looking for a deeper meaning than actually exists.
Code editors generally highlight certain parts of the code in order to make it easier for the developer to read.
In any editor, the parts of the code that are highlighted in the same colour will usually have something in common.
For example:
the “orange” html texts that you’re seeing are all attribute values. (They’re blue in FCC on my laptop).
the “orange” css texts are all CSS value keywords (also blue in FCC on my laptop).
But different code editors will use different colours and may choose to highlight different parts of the code.
For example:
in VS Code (a different code editor) html element tags are highlighted in dark blue while in FCC they’re highlighted in a colour I would call burgundy.
I think FCC uses the same “burgundy” colour for CSS selectors, whereas VS Code uses a light blue highlight.
And, in VS Code, someone using a different “theme” to the one I use, will probably see completely different highlighting colours.