Tip Precoz 2: combinando @media
Los media type especifican el soporte al cual apunta la hoja de estilos definida: pantalla (screen), [papel (print)][1], [móviles (handheld)][2], etc. Algunas propiedades CSS están diseñadas para medios específicos (page-break-after y page-break-before se usan para media=“print” por ejemplo), y en otros casos propiedades son compartidos por diferentes medios, pero usan diferentes unidades (pixel para pantalla, centímetros para papel).
Usualmente se especifican los medios al cual apuntan las hojas de estilos como atributo de la etiqueta , de la siguiente forma:
Sin embargo existen otros 2 métodos, los cuales pueden ser utilizados dentros mismo de las hojas de estilos. El segundo mediante @import:
Y el tercero, a través de la regla @media:
Con esta regla, podemos definir dentro de nuestras hojas de estilos las propiedades y valores para cada medio, sin necesidad de linkear otras hojas de estilo externas:
Para entregar información más completa, todos los medios disponibles en CSS 2 son:
- all
- todos los medios
- aural
- para sintetizadores de voz
- braille
- para dispositivos táctiles que usan braille
- embossed
- utilizada para impresoras para braille
- handheld
- dispositivvos móviles
- material impreso
- projection
- proyectores o impresores de transparencias
- screen
- pantallas en color en general
- tty
- medios con caracter en grilla, como teletipos, terminales o dispositivos móviles con capacidad limitada. Al tener nula resoución, no se debe usar la unidad de pixeles.
- tv
- dispositivos de televisión (baja resolución)
Link:⌗
[1]: http://www.csslab.cl/2005/11/15/mediaprint/ “Enlace en CSSLab a “media=‘print’ (actualizado)”” [2]: http://www.csslab.cl/2006/03/07/css-para-moviles/ “Enlace en CSSLab a “CSS para móviles””