Lesefortschritt:

Aufzählungsliste absteigend nummerieren

22. Februar 2023 | HTML

Dieser Beitrag beinhaltet 581 Wörter. – Geschätzte Lesezeit: ca. 3 Minuten.

Ein kleiner handlicher Hack lässt die klassische Aufzählungsliste <ol> umgekehrt aufzählen: beginnend mit dem höchsten Wert und endend mit dem kleinsten. Dem HTML-Code wird nur ein kleines Attribut hinzugefügt, schon wird die Aufzählung rückwärts nummeriert.

Hinter nummerierten Aufzählungslisten kann etwa ein Code dieser Art stehen:

<ol>
  <li>erste Zeile</li>
  <li>zweite Zeile</li>
  <li>dritte Zeile</li>
  <li>vierte Zeile</li>
</ol>

Dieser Code gibt folgendes Ergebnis:

  1. erste Zeile
  2. zweite Zeile
  3. dritte Zeile
  4. vierte Zeile

Nun lässt sich mit einem simplen Trick die Liste umdrehen – bzw: die Liste absteigend nummerieren. Dem <ol>-Tag wird dafür bloss das Attribut «reversed» hinzugefügt. So wie in diesem Code:

<ol reversed>
  <li>erste Zeile</li>
  <li>zweite Zeile</li>
  <li>dritte Zeile</li>
  <li>vierte Zeile</li>
</ol>

Nun sieht das Ergebnis so aus:

  1. erste Zeile
  2. zweite Zeile
  3. dritte Zeile
  4. vierte Zeile

Ehrlich gesagt: Einen Verwendungszweck für sowas seh ich jetzt auch nicht auf Anhieb. Ist aber noch lustig, zu wissen.

Werbung

Werbung

 

Kostenlose WordPress- und Divi-Tricks im Abo

Wir schicken Ihnen sporadisch (weniger als 10x jährlich) neue Tricks für Wordpress und das Divi-Theme, aber auch hilfreiche CSS- und HTML-Codes frei Haus.

Füllen Sie zur Anmeldung das folgende Formular aus. Angaben mit * sind Pflichtangaben.






Vielen Dank.

Pin It on Pinterest

Share This