7.2 Especificación de hojas de estilos dependientes de los medios
Actualmente hay dos maneras de especificar la dependencia de las hojas de estilos:
Especificando el medio de destino desde una hoja de estilo con las reglas-arroba @media o @import.
Ejemplo(s):
@import url("loudvoice.css") aural;
@media print {
/* la hoja de estilo para impresión va aquí */
}
Especificando el medio de destino dentro del lenguaje del documento. Por ejemplo, en HTML 4.0 ([HTML40]), el atributo "media" en el elemento LINK especifica el medio de destino de una hoja de estilo externa:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<HTML>
<HEAD>
<TITLE>Vínculo a un medio</TITLE>
<LINK rel="stylesheet" type="text/css"
media="print, handheld" href="foo.css">
</HEAD>
<BODY>
<P>El cuerpo...
</BODY>
</HTML>
La regla @import es definida en el capítulo sobre cascada.
7.2.1 La regla @media
Una regla @media especifica los tipos de medios de destino (separados por comas) de un juego de reglas (delimitadas por llaves). La construcción @media le permite a la hoja de estilo reglas para distintos medios en la misma hoja de estilo:
@media print {
BODY { font-size: 10pt }
}
@media screen {
BODY { font-size: 12pt }
}
@media screen, print {
BODY { line-height: 1.2 }
}