Introducción a CSS
2.1.2. Selector de tipo o etiqueta
Selecciona todos los elementos de la página cuya etiqueta
HTML
coincide con el valor del selector. El siguiente ejemplo
selecciona
todos los párrafos de
la página:
p { ... }
Introducción a CSS Capítulo 2. Selectores
Para utilizar este selector, solamente es necesario indicar
el nombre
de una etiqueta HTML (sin los caracteres < y >)
correspondiente a los
elementos que se
quieren seleccionar.
El siguiente ejemplo aplica diferentes estilos a los titulares
y a los
párrafos de una
página HTML:
h1 {color:
red; }
h2 { color:
blue; } p { color: black;}
Si se quiere aplicar los mismos estilos a dos etiquetas
diferentes, se
pueden encadenar los
selectores. En el siguiente ejemplo, los títulos
de sección h1, h2 y
h3 comparten los mismos estilos: h1 {color: #8A8E27;
font-weight:
normal; font-family: Arial, Helvetica, sans-serif; }h2 {
color:
#8A8E27; font-weight: normal; font-family: Arial, Helvetica,
sans-serif;
} h3 {color: #8A8E27; font-weight: normal;
font-family:
Arial, Helvetica, sans-serif;}
En este caso, CSS permite agrupar todas las reglas
individuales en una
sola regla con un
selector múltiple. Para ello, se incluyen todos los
selectores separados
por una coma (,) y el resultado es
que la siguiente regla CSS es equivalente a las tres reglas
anteriores:
h1, h2, h3
{color: #8A8E27; font-weight: normal;font-family: Arial,
Helvetica,
sans-serif;}
En las hojas de estilo complejas, es habitual agrupar las
propiedades
comunes de varios elementos en una única regla CSS y
posteriormente
definir las
propiedades específicas de esos mismos elementos. El
siguiente ejemplo
establece en primer lugar las propiedades comunes de
los títulos de sección (color y tipo de letra) y a
continuación, establece
el tamaño de letra de cada uno de ellos: h1, h2, h3 {color:
#8A8E27;
font-weight:
normal; font-family: Arial, Helvetica, sans-serif;}
h1 {
font-size: 2em; }
h2 {
font-size: 1.5em; }
h3 { font-size: 1.2em; }
Fuente: Introducción a CSS
Javier Eguíluz Pérez