How do you combine an element selector with a class selector (e.g. p.intro)?

Writing a tag and a class with no space between them (p.intro) means "AND": the rule matches only elements that are both that tag and have that class.

This narrows a rule so it fires only when several conditions hold at once. Glue the parts together with no whitespace:

p.einleitung {
    font-weight: bold;
}

That matches <p class="einleitung"> but not <div class="einleitung"> and not a <p> without the class. The space is the key: no space means "the same element must satisfy all parts"; a space would mean a descendant relationship instead (covered in the combinators card), which is a completely different thing.

The same "AND" logic chains further:

/* element + id: a <div> that also has id="header" */
div#header { background: navy; }

/* two classes: an element carrying BOTH btn and primary */
.btn.primary { background: blue; }   /* matches <button class="btn primary"> */

A practical use is styling one tag's variant without affecting other tags that happen to share the class — p.note styles note paragraphs while leaving <div class="note"> alone.