CSS Media Types (Medios de CSS)


Una de las caracteristicas de las hojas de estilo es que podemos definir la forma en que se visualizara el contenido dependiendo del dispositivo o medio en el que se presenta la informacion. Por ejemplo el monitor, en papel, un dispositivo braille, etc. es decir que un documento puede tener una presentacion al visualizarla en el monitor y otra diferente al momento de imprimirlo.

En la especificacion CSS 2.1 se listan 10 tipos:

  • all Utilizado para todos los dispositivos.
  • braille Utilizado para la retroalimentacion tactil de dispositivos braille.
  • embossed Utilizado para impresoras paginadas en braille.
  • handheld Utilizado para dispositivos moviles.
  • print Utilizado para documentos paginados destinados a ser impresos y para documentos vistos sobre pantalla en modo de vista preliminar.
  • projection Utilizado para presentaciones proyectadas.
  • screen Utilizado principalmente para pantallas del ordenador.
  • speech Utilizado para sintetizadores de voz.
  • tty Querido para medios de comunicación que usan una rejilla de carácter de diapasón fijo (como teletipos, terminales, o dispositivos portátiles con capacidades de demostración limitadas).
  • tv Destinado para dispositivos de tipo de televisión.

Existen 2 formas para definir el medio de CSS la primera de ellas es utilizando @media o @import veamos un ejemplo:

@import url(“estilo.css”) screen;

@media print {
          body { font-size: 10pt }
}

La otra forma es colocandolo en el atributo media de la etiqueta  LINK

<link rel=”stylesheet”  type=”text/css”  href=”estilo.css” media=”screen”>

Fuente: W3C

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s