JSFiddle - React, Tailwind, and code Playground

by juErik

HTML

<div>
       <ul class="naviList1">
          <li>
             <a href="page1.html">Link zur Seite 1</a>
             <a href="page2.html">Link zur Seite 2</a>
             <a href="page3.html">Link zur Seite 3</a>
          </li>
       </ul>
    </div>

     <div>
       <ul class="naviList2">
          <li>
             <a href="page1.html">Link zur Seite 1</a>
             <a href="page2.html">Link zur Seite 2</a>
             <a href="page3.html">Link zur Seite 3</a>
          </li>
       </ul>
    </div>

<h4>10. Kombinieren von Selektoren</h4>
<p>Das Kombinieren von Selektoren ist beliebig möglich, allgemein gilt: Wenn zwischen
 Objektselektor und Klasse (bzw. Id) kein Leerzeichen steht, so werden diejenigen Objekte angesprochen, die dem Objektselektor entsprechen UND das jeweilige Id- (oder Klassenattribut)
besitzen. Wenn jedoch ein Keerzeichen dazwischensteht, so wird nach einem Element gesucht, das das jeweilige Klassen- (bzw. Id-)Attribut aufweist und sich hierarchisch  UNTERHALB des anderen Objektes befindet.</p>

CSS

div .naviList1 a {
    background-color: #FFFF11;
}

ul.naviList2 a {
    background-color: #FFAAFF;
}