Clarification between using "." and "#"


this is a silly questions i'm sure, but I think I missed something in a previous section when we learned to link the different divs from html to css... why is it on some of the css elements, we use the "." such as ".fancy" and others, we use the "#" such as "#serious"? or does it even matter which is used? and if so, how do we know which to use when?


isn't this explained in the lessons? anyway, the pound/number sign (#) is used to select id's:

<div id="idname"></div>


#idname { property: value; }

the dot is used for classes:

<div id="classname"></div>


#classname { property: value; }

so yea, there is quit a difference if you use a dot or number sign.How to know which to use? well if you use a id in html, you use the number sign, if you use classes you use the dot


'#' is used to select ID.

So if you have html element such as:

<p id = "serious">Hello</p>

in CSS you select this element using

#serious{ ...css code...}

'.' on the other hand is used to select CLASS.
For example you have an element such as:

<p class = "fancy">Hello</p>

in CSS you select this element using:

.fancy{ ...css code... }

And to answer the question what is the difference. Any ID can be associated with only one element so if you used id = "serious" in one paragraph you CANNOT use it again for any other paragraph nor different element type.
On the other hand class can be associated with more than one element. In fact you can have as many elements with class = "fancy" as you want. This is used when you want to edit a group of elements. Single class can be used in different element types.