Listenmarkierungen entfernen, ohne die Semantik zu beeinträchtigen

:where(ul, li, menu) {
  list-style: "";
}

Der „korrektere“ Ansatz ist, list-style auf none zu setzen, aber das hat die versteckte Konsequenz, dass Safari das Element semantisch nicht mehr als richtige Liste erkennt. Wir könnten dies in HTML beheben

<ol style="list-style: none;" role="list">
  <li role="listItem">...</li>
  <li role="listItem">...</li>
  <li role="listItem">...</li>
</ol>

<ul style="list-style: none;" role="list">
  <li role="listItem">...</li>
  <li role="listItem">...</li>
  <li role="listItem">...</li>
</ul>

…aber das CSS-Snippet erspart uns, Dinge an zwei Stellen pflegen zu müssen. Das Snippet funktioniert, weil ein leerer String genau das ergibt: einen leeren String.

Wie bei allem dieser Art lohnt es sich, dies gründlich mit Screenreadern und echten Benutzern zu testen, um sicherzustellen, dass die Semantik und Barrierefreiheit Ihrer Arbeit nicht negativ beeinträchtigt werden.