Vorlage:Listenstile/styles.css

/* Definition von liste-zaehler */
/* - Klasse 'liste-zaehler' für die Definition und Berechnung */
/* - Klasse 'liste-display' für die Anzeige bei jedem Element */

ul.liste-zaehler {
	counter-reset: listZaehler;
}
ul.liste-zaehler.liste-display li::before {
	display: inline-block;
	padding-right: 0.5em;
	padding-left: 0.5em;
	border-top: 1px solid #777777;
	border-bottom: 1px solid #777777;
	text-align: right;
	font-size: 80%;
	vertical-align: inherit;
	background-color: #eaecf0;
	content: "";
}
ul.liste-zaehler li {
	counter-increment: listZaehler;
}
ul.liste-zaehler.liste-display li::before {
	content: attr(data-zaehler-vor) counter(listZaehler) attr(data-zaehler-nach);
}
ul.liste-zaehler.liste-display li:first-child::before {
	font-weight: bold;
	content: attr(data-zaehler-spalte);
}

/* Farbanpassungen zu liste-zaehler */
/* - Werte für 9 der Standard-Hintergrundfarben */

ul.liste-zaehler.liste-display li.hintergrundfarbe1::before {
	background-color: #f8f9fa;
}
ul.liste-zaehler.liste-display li.hintergrundfarbe2::before {
	background-color: #ffffff;
}
ul.liste-zaehler.liste-display li.hintergrundfarbe3::before {
	background-color: #ffff40;
}
ul.liste-zaehler.liste-display li.hintergrundfarbe4::before {
	background-color: #ffaa00;
}
ul.liste-zaehler.liste-display li.hintergrundfarbe6::before {
	background-color: #b3b7ff;
}
ul.liste-zaehler.liste-display li.hintergrundfarbe7::before {
	background-color: #ffcbcb;
}
ul.liste-zaehler.liste-display li.hintergrundfarbe8::before {
	background-color: #ffebad;
}
ul.liste-zaehler.liste-display li.hintergrundfarbe9::before {
	background-color: #b9ffc5;
}