Veit Schiele Communications

Veit Schiele Communications

Verwenden von :not()

Dies erlaubt elegante und leichtgewichtige Anweisungen z.B. für komma-seaprierte Listen.
erstellt von Veit Schielezuletzt verändert: 19.03.2017 15:17 © Veit Schiele Communications GmbH, 2015–2017

Das Pseudoelement :not() eignet sich hervorragend um eine Anweisung für ein spezifisches Element auszunehmen, also z.B.:

.nav li:not(:last-child) {
    border-bottom: 1px solid #002652;
}

anstatt:

/* add border */
.nav li {
    border-bottom: 1px solid #002652;
}
/* remove border */
.nav li:last-child {
    border-bottom: none;
}

Komma-separierte Listen

ul > li:not(:last-child)::after {
    content: ", ";
}

Hiermit wird zwar zwischen den Listeneinträgen, nicht jedoch am Ende der Liste ein Komma eingefügt.

Misc

a[href]:not([class]) {
    …
}