Selectores CSS

Selecciona todos los elementos que coinciden con el nombre del elemento especificado.

Sintaxis: eltname

Ejemplo: input se aplicará a cualquier elemento <input>.

Selecciona todos los elementos que tienen el atributo de class especificado.

Sintaxis: .classname

Ejemplo: .index seleccionará cualquier elemento que tenga la clase "index".

Selecciona un elemento basándose en el valor de su atributo id. Solo puede haber un elemento con un determinado ID dentro de un documento.

Sintaxis: #idname

Ejemplo: #toc se aplicará a cualquier elemento que tenga el ID "toc".

Selecciona todos los elementos. Opcionalmente, puede estar restringido a un espacio de nombre específico o a todos los espacios de nombres.

Sintaxis: * ns|* *|*

Ejemplo: * se aplicará a todos los elementos del documento.

Selecciona elementos basándose en el valor de un determinado atributo.

Sintaxis: [attr] [attr=value] [attr~=value] [attr|=value] [attr^=value] [attr$=value] [attr*=value]

Ejemplo: [autoplay] seleccionará todos los elementos que tengan el atributo "autoplay" establecido (a cualquier valor).

El combinador + selecciona hermanos adyacentes. Esto quiere decir que el segundo elemento sigue directamente al primero y ambos comparten el mismo elemento padre.

Sintaxis: A + B

Ejemplo: La regla h2 + p se aplicará a todos los elementos <p> que siguen directamente a un elemento <h2>.

El combinador ~ selecciona hermanos. Esto quiere decir que el segundo elemento sigue al primero (no necesariamente de forma inmediata) y ambos comparten el mismo elemento padre.

Sintaxis: A ~ B

Ejemplo: La regla p ~ span se aplicará a todos los elementos <span> que siguen un elemento <p>.

El combinador > selecciona los elementos que son hijos directos del primer elemento.

Sintaxis: A > B

Ejemplo: La regla ul > li se aplicará a todos los elementos <li> que son hijos directos de un elemento <ul>.

El combinador (espacio) selecciona los elementos que son descendientes del primer elemento.

Sintaxis: A B

Ejemplo: La regla div span se aplicará a todos los elementos <span> que están dentro de un elemento <div>.

El combinador || selecciona los elementos especificados pertenecientes a una columna.

Sintaxis: A || B

Ejemplo: col || td seleccionará todos los elementos <td> que pertenezcan al ámbito de <col>.

Ejemplo: La regla a:visited se aplicará a todos los elementos <a> que hayan sido visitados por el usuario.

Ejemplo: La regla p::first-line se aplicará a la primera línea de texto de todos los elementos <p>.