Tipos de medios
Uno de los rasgos más importantes de las hojas de estilo es que especifican cómo debe ser presentado un documento en diferentes medios: en la pantalla, en papel, con un sintetizador de voz, con un dispositivo braille, etc.
Ciertas propiedades CSS son diseñadas sólo para ciertos medios (ejemplo, la propiedad 'cue-before' para las aplicaciones del usuario auditivas). En ocasiones, sin embargo, las hojas de estilo para diferentes tipos de medios pueden compartir una propiedad, pero requieren de valores diferentes para esa propiedad. Por ejemplo, la propiedad 'font-size' es útil para la pantalla y los medios impresos. Sin embargo, los dos medios son lo suficientemente diferentes como para requerir diferentes valores para la propiedad común; un documento necesitará típicamente una fuente mayor en una pantalla de computadora que sobre papel. La experiencia también demuestra que las fuentes sans-serif son más fáciles de leer en pantalla, mientras que las fuentes con serif son más fáciles de leer sobre papel. Por estas razones, es necesario expresar que una hoja de estilo --o una sección de una hoja de estilo-- se aplica a ciertos tipos de medios.
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.
@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 @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 }
}
Tipos de medios reconocidos
Un tipo de medio de CSS designa un juego de propiedades CSS. Una aplicación del usuario
que aspira a dar soporte a un tipo de medio por nombre debe implementar todas las
propiedades que se aplican a ese tipo de medio. Los nombres elegidos para los tipos
de medios de CSS reflejan los dispositivos de destino para los cuales las propiedades
relevantes tienen sentido. En el siguiente listado de tipos de medios de CSS, las
descripciones entre paréntesis no son normativas. Solamente brindan un sentido
de la clase de dispositivo del tipo de medio a que se hace referencia.
- all
- Apropiado para todos los dispositivos.
- aural
- Propuesto para los sintetizadores de voz. Ver la sección sobre hojas de estilo
auditivas para más detalles. - braille
- Propuesto para dispositivos táctiles braille.
- embossed
- Propuesto para impresoras de páginas braille.
- handheld
- Propuesto para dispositivos de mano (típicamente de pantalla pequeña, monocromos,
de limitado ancho de banda). - Propuesto para material opaco en páginas y para documentos
percibidos en pantalla en modo de vista previa a la impresión. Por
favor, consulte la sección sobre medios paginados por información acerca de los
formatos de publicación que son específicos de los medios paginados. - projection
- Propuesto para las presentaciones proyectadas, por ejemplo,
proyectores o transparencias impresas. Por favor, consulte la sección
sobre medios paginados por información acerca de los formatos de publicación
que son específicos de los medios paginados. - screen
- Propuesto primariamente para pantallas de computadora a color.
- tty
- Propuesto para medios que usan una grilla de caracteres de
espacio fijo, tales como teletipos, terminales o dispositivos portátiles
con limitada capacidad del monitor. Los autores no deben usar las unidades en
pixeles con el tipo de medio "tty". - tv
- Propuesto para dispositivos de tipo televisión (baja resolución, color, pantalla con limitado desplazamiento, sonido disponible).
de tipos de medios que pueden ser valores para @media.
No hay comentarios:
Publicar un comentario