Selectores
A la hora de aplicar estilos a nuestros elementos HTML necesitamos un mecanismo que permita identificar sobre cuál o cuáles de estos elementos queremos actuar. Para ello se utilizan los selectores, estos permiten identificar a qué elementos de nuestro código HTML vamos a aplicar el estilo definido. Existe diferentes selectores, a continuación veremos los más importantes.
Selector universal
El selector universal (*
) sirve para seleccionar todos los elementos de la página. Se aplican los estilos a todos los elementos.
* {
margin: 10px;
padding: 5px;
}
Selectores de etiqueta
En este caso, los estilos se aplican solo a la etiqueta.
Por ejemplo, si queremos aplicar estilos a los párrafos:
p {
text-align: center;
}
En este ejemplo, los párrafos serán alineados al centro.
Si queremos ajustar los mismos estilos a dos etiquetas diferentes podemos ponerlos separados por comas.
p, h1, h2 {
text-align: center;
}
En este ejemplo, tanto los párrafos como los encabezados de tipo 1 y 2 serán alineados al centro.