FEBRERO 12 DEL 2019

SELECTORES:

SELECTORES:

En las hojas de estilo CSS, los selectores son la parte de las reglas que indican al navegador a qué elementos se van a aplicar las propiedades incluidas en las declaraciones.

Selectores de tipo

Selecciona todos los elementos que coinciden con el nombre dado.
Sintáxis: eltname
Ejemplo: input se aplicará a cualquier elemento <input>.

Selectores de clase

Selecciona todos los elementos dado un atributo de class.
Sintáxis: .classname
Ejemplo: .index se aplicará a cualquier elemento que tenga la clase "index".

Selectores de ID

Selecciona un elemento basándose en el valor de su atributo id. Solo puede haber un elemento con un ID dado en un documento.
Sintáxis: #idname
Ejemplo: #toc se aplicará a cualquier elemento que tenga el ID "toc".

Selector universal

Selecciona todos los elementos. Puede estar restringido a un espacio de nombres o a todos los espacios de nombres.
Sintáxis: * ns|* *|*
Ejemplo: * se aplicará a todos los elementos del documento.

Selectores de atributo

Selecciona elementos basándose en el valor de un atributo dado.
Sintáxis: [attr] [attr=value] [attr~=value] [attr|=value] [attr^=value] [attr$=value] [attr*=value]
Ejemplo: [autoplay] se aplicará a todos los elementos que tengan el atributo "autoplay" asignado (a cualquier valor).

CombinadoresSección

Selectores de hermanos adyacentes

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>.

 

Selectores de hermanos generales

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>.

Selectores de hijo

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>.

 

Selectores descendientes

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>.