Ruwiki

Selectores

Determinan sobre qué elemento o elementos se debe aplicar un estilo. Hay varios tipos:

• Universal: selecciona todos los elementos. Su sintaxis es "*"
• De tipo: selecciona todos los elementos de un tipo determinado. Su sintaxis es "nombreElemento"
• De clase: selecciona todos los elementos de una determinada clase. Su sintaxis es ".nombreClase"
• De identificador: selecciona el elemento con el identificador indicado. Su sintaxis es "#identificador"
• De atributo: selecciona los elementos que tienen un determinado atributo con unas características específicas. Su sintaxis es "[atributo]"

Pseudoclases

Se añade como palabra clave a continuación de un selector convencional, creando un nuevo filtro de selección en función del estado del elemento o de los elementos filtrados por el selector.
Hay pseudoelementos(referencia a un elemento en concreto, dos puntos dobles) y pseudoclases(hace referencia a un estado del elemento, dos puntos simples) Dos ejemplos:

                    .claseboton:hover{/* Al poner el ratón encima del elemento con dicha clase */
                        transition:0.5s;
                        background:red;
                    }
                    p::first-letter{/* Esto haría que la primera letra de todos los párrafos sea de color rojo */
                        color:red;
                    }
                

Combinadores

Selectores en los que se tiene en cuenta la relación entre elementos en la estructura jerárquica del documento
Tipos:

• De hermanos: A~B || A y B son hermanos
• De hijo: A>B || B es hijo de A
• De hermanos adyacentes: A+B || A y B son hermanos y B está inmediatamente a continuación de A
• De identificador: A B || B es descendiente de A, pero no necesariamente es hijo directo

Propiedades