Teoría
Teoría

La pseudoclase :not

La pseudoclase :not(selector) permite negar una condición. Con ella puedes seleccionar elementos que NO coincidan con el selector indicado:

li:not(:last-child) { }

Este selector selecciona todas las etiquetas <li> que NO sean el último elemento hijo de su padre.

La pseudoclase :not se parece al operador ! de programación:

if (!selector) { ... }

Dentro de :not() podemos usar pseudoclases, etiquetas, identificadores, clases y selectores de atributos. Los pseudoelementos, como ::after, no se admiten (veremos los pseudoelementos más adelante en este capítulo).

index.html
style.css

HTML

<!DOCTYPE html> <html lang="es"> <head> <meta charset="utf-8"> <title>La pseudoclase :not</title> <link rel="stylesheet" href="course.css"> <link rel="stylesheet" href="style.css"> </head> <body> <ul class="cards"> <li class="ace heart"></li> <li class="king diamond"></li> <li class="queen club"></li> <li class="jack spade"></li> <li class="king club"></li> <li class="ace spade"></li> <li class="jack heart"></li> </ul> <ul class="cards"> <li class="jack diamond"></li> <li class="ace club"></li> <li class="king spade"></li> <li class="queen heart"></li> <li class="queen spade"></li> <li class="king heart"></li> <li class="ace diamond"></li> </ul> <ul class="cards"> <li class="queen spade"></li> <li class="king heart"></li> <li class="king club"></li> <li class="ace spade"></li> <li class="jack heart"></li> <li class="queen diamond"></li> <li class="ace diamond"></li> </ul> <ul class="cards"> <li class="queen spade"></li> <li class="ace spade"></li> <li class="jack heart"></li> <li class="ace spade"></li> <li class="ace heart"></li> <li class="queen diamond"></li> <li class="ace diamond"></li> </ul> </body> </html>

CSS

ObjetivosRealizado

Asigna el color de fondo #808080 a todas las cartas, excepto a los reyes .king.
Asigna el color de texto #0099ff a todas las cartas, excepto a las de diamantes .diamond.
Asigna la fuente "Arial", sans-serif a todas las cartas, excepto a la primera de cada fila.