FEBRERO 12/2019


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.

tipos de selectores:


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).
Combinadores:Secció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>.
EJERCICIO:


Comentarios

Entradas populares de este blog

Clase # 5 Operadores racionales y lógicos

Clase # 4 Software y Algoritmos

Clase # 3 (Mayo 21) Fundamentos de Algoritmo