What is a css collating selector? e.g. p.class or .class p

Question

While debugging some css, I noticed that there is a difference between this declaration order. The first one called the headers inside the anchors to display the inline line as desired, the second one apparently didn't match:

1/ a.aname { display:inline; margin:0px;}
2/ .aname a { display:inline; margin:0px;}

<a name="download" class="aname"><h2>Download</h2></a>

I basically used the second form to apply class styles. What is the difference in how they are applied, and are there any guidelines for when to use them? (to avoid css-puzzlement that occurs when it was done wrong)

---

Basic solution from answers:

Use "direct selection" elementtype.class{}or elementtype#id{}to directly apply a style to elements. For styling, which should affect once every time you use a rule, for example. changing the field, changing the display, changing the font, not associated with the inheritance. Direct selection does not inherit child elements; it applies only to the parent element.

" " .class elementtype{} #id elementtype, / . , / , , . , . , .

NBself: ;)

Answer 1

- , CSS.

a.aname aname, .aname a , aname:

<a class="aname">This matches the first rule</a>

<span class="aname"><a>This matches the second rule</a></span>

CSS:

space = descendant combinator

> = child combinator (direct descendant)

+ = adjacent sibling combinator

Selectutorial .

, , . :

#id.class { ... }
.class#id { ... }