Normalmente, se da el caso en que dos elementos del documento HTML comparten la definición de la misma propiedad CSS. Estos elementos podemos declararlos de una forma extendida:
H1 {color: purple;}
H2 {color: purple;}
H3 {color: purple;}
H4 {color: purple;}
H5 {color: purple;}
H6 {color: purple;}
O utilizar la agrupación para conseguir una declaración más
compacta (el resultado es el mismo en ambos casos):
H1, H2, H3, H4, H5, H6 {color:
purple;}
Otros ejemplos de estructuras de agrupación que son
equivalentes:
H1 {color: purple; background: white;}
H2 {color: purple; background: green;}
H3 {color: white; background: green;}
H4 {color: purple; background: white;}
B {color: red; background: white;}
H1, H2, H4 {color: purple;}
H2, H3 {background: green;}
H1, H4, B {background: white;}
H3 {color: white;}
B {color: red;}
H1, H4 {color: purple; background: white;}
H2 {color: purple;}
H3 {color: white;}
H2, H3 {background: green;}
B {color: red; background: white;}
Agrupación de declaraciones.- Podemos agrupar declaraciones cuando tenemos diferentes reglas que definen propiedades de un mismo elemento. Por ejemplo:
H1 {font: 18pt Helvetica;}
H1 {color: purple;}
H1 {background: aqua;}
Podemos redefirnirlo como:
H1 {font: 18pt Helvetica; color: purple; background:
aqua;}
Los espacios en blanco serán ignorados, así que el navegador se
fiará de la correcta estructura sintáctica de las reglas. Es por
eso, que para una más sencilla visualización, podemos escribir las
reglas CSS de esta forma:
H1 {
font: 18pt Helvetica;
color: purple;
background: aqua;
}
Es una buena práctica terminar las declaraciones siempre con punto
y coma (aunque no es obligatorio). Motivos:
-Te permite habituarte a terminar las declaraciones
correctamente, que es uno de los errores más comunes.
-Si decides añadir una nueva declaración a la regla, no tiens
porque preocuparte de cómo termina la anterior.
-Algumos navegadores antiguos pueden confundirse cuando las reglas
no se terminan adecuadamente.
Combinaciones de agrupación de selectores y
declaraciones.-
BODY {background: white; color: gray;}
H1, H2, H3, H4, H5, H6 {font-family: Helvetica, sans-serif;
color: white; background: black;}
H1, H2, H3 {border: 2px solid gray; font-weight: bold;}
H4, H5, H6 {border: 1px solid gray;}
P, TABLE {color: gray; font-family: Times, serif;}
PRE {margin: 1em; color: maroon;}
Hay 109 opiniones. Opina sobre este curso.
| Cursos | Valoración | Alumnos | Vídeo | |
|---|---|---|---|---|
|
Nueve formas de incrementar sus ventas en Internet En este curso conocerá 9 técnicas de marketing muy fáciles y rápidas que permiten incrementar las ventas de un producto por Internet.... [02/06/05] |
|
1.811 | ||
|
Las redes. Transmisión de datos (segunda parte) El presente es la segunda parte del curso sobre comunicación y transferencia de datos a través de redes. Ahora podrás ampliar tus conocimientos sobre la comunicación en r... [27/08/08] |
|
1.676 | ||
|
Internet El trabajo presentado a continuación corresponde a la investigación de Internet, sus conceptos, historias y servicios.Este fue realizado con investigaciones en In... [07/06/06] |
|
1.321 | ||
Publicar en
del.icio.us
digg
meneame