Dieses Snippet funktioniert nicht so, wie ich es erwartet habe:

div li span:first-child {
  font-weight: bold;
}

<div>
  <ul>
    <li><span>This is a test</span></li>
    <li>And <span>this is also a test</span></li>
  </ul>
</div>

Beidespan -Elemente sind fett gedruckt. Ich hätte erwartet, dass der 2. nicht fett ist, da er dem Klartext folgt"And ", aber ich denke:first-child betrachtet Textinhalt nicht als Kind.

Gibt es eine Möglichkeit, diese beiden Situationen zu unterscheiden und Elemente auszuwählen, denen kein Inhalt oder keine Geschwister vorangestellt sind?

Um klarzustellen In meinem speziellen Fall möchte ich ein @ mach<span> Element in jedem<li> -Element fett, aber nur, wenn es am Anfang des @ ste<li> und ohne vorangestelltem Text oder anderen Elementen.