Wie kann ich reguläre Zeichen verwenden, um benutzerdefinierte Aufzählungszeichen für „Elemente' zu erstellen?

Alternatives benutzerdefiniertes Aufzählungszeichen für

Elemente mit regulären Zeichen

Es stellt sich die Frage bezüglich der Anpassung von Aufzählungszeichen in HTMLs

Element mit einem einfachen Zeichen anstelle eines Bildes. Während CSS die Angabe einer benutzerdefinierten Grafik mithilfe der Eigenschaft „list-style-image“ ermöglicht, besteht der Wunsch darin, die Erstellung eines separaten Bilds für ein einfaches Pluszeichen ( ) zu vermeiden und es direkt als Aufzählungszeichen zu integrieren.

Lösung

Die bereitgestellte Lösung macht das Erstellen und Referenzieren einer separaten Grafik überflüssig. Durch die Nutzung der CSS-Eigenschaften „content“ und „list-style“ können die folgenden Stile angewendet werden:

ul {
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}

li {
  padding-left: 1em;
  text-indent: -1em;
}

li:before {
  content: "+";
  padding-right: 5px;
}

Bei diesem Ansatz wird das Pluszeichen effektiv als Aufzählungszeichen angezeigt, mit der richtigen Einrückung, um die Listenelemente auszurichten.

Das obige ist der detaillierte Inhalt vonWie kann ich reguläre Zeichen verwenden, um benutzerdefinierte Aufzählungszeichen für „Elemente' zu erstellen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!