I kept seeing style generators format some css tags with a #(pound) sign and the css style have a .(period) in front of the declaration. This got me to thinking, wtf is the difference? I was never a big CSS stylesheet guy. I know my way around it, but generally used style builder tools to save me the headache of all the little tag nuances. I also have been hand coding HTML for well over a decade. So, when I saw a # sign, it threw me off.
I am sure it has been around a lot longer than I give it credit, but I figured I would research what its use is for. Of course, the answer is amazingly simple.
# is for ID referencing and . is for class declaration.
/* normal class declaration. What I am used to */
/* fancy ID referencing */
<a id=lnkHomePage href=’Home’>Go Home</a>
Above, lnkHomePage is the ID. To reference in CSS:
This will style only that one tag. You know how to use classes, so I won’t bore you with that.
Well, short example.
<a id=lnkHomePage class=MyClass href=’Home’>Go Home</a>
Above uses the MyClass class declaration, shown up above.
Hope this helps clarify this simply concept. At least now you will know why the tags appear the way they do. Personally, I don’t see a lot of utility for the ID CSS reference unless you really like all your styles in one place and don’t like inline styling.