NovaMonoFix
Errores PHP
X
Usuario
Password
0 FPS

Regla CSS : @media

23 de Diciembre del 2015 por Josep Antoni Bover, 485 visitas, 0 comentarios, 0 votos.
Categorías : CSS.
La web está en segundo plano, animación en pausa.
Cargando animación...

Esta regla nos permite especificar un conjunto de selectores que solo se utilizaran en el caso de estar en el medio especificado.


Sintaxis

@media not|only <tipo de medio> and (Caracteristicas) { Selectores }
Si no especificamos not o only por defecto se tratará como only.

Tipos de medio

all Todos los medios posibles.
braile Para dispositivos tactiles con soporte para braile.
embossed Para dispositivos de impresión braile.
handheld Para dispositivos de mano (normalmente pequeña pantalla, ancho de banda limitado).
print Para previsualizaciones de impresión.
projection Para presentación, por ejemplo en proyectores.
screen Para pantallas de ordenador a color.
speech Para sintetizadores.
tty Para medios de comunicación que utilizan una cuadrícula de caracteres fija (como teletipos, terminales o dispositivos portátiles con capacidades de visualización limitadas). No se debe utilizar unidades de pixel con este tipo de medio.
tv Para televisores (baja resolución, color, limitaciones de scroll, y sonido disponible).

Caracteristicas

aspect-ratio La relación entre la anchura y la altura de la vista (espacio de la ventana cliente / viewport).
color Número de bits que usa cada canal de color.
color-index Número de colores que se pueden mostrar en el dispositivo.
device-aspect-ratio La relación entre la anchura y la altura de la dispositivo de salida (pantalla).
device-height La altura del dispositivo.
device-width El ancho del dispositivo.
grid Si el dispositivo usa una rejilla o un mapa de bits.
height La altura de la ventana cliente / viewport.
max-aspect-ratio La relación máxima entre la anchura y la altura de la vista (espacio de la ventana cliente / viewport).
max-color El número máximo de bits por canal de color del dispositivo de salida (pantalla).
max-color-index El número máximo colores que puede mostrar el dispositivo de salida (pantalla).
max-device-aspect-ratio El máximo de relación entre la altura y el ancho del dispositivo de salida (pantalla).
max-device-height La altura máxima del dispositivo de salida (pantalla).
max-device-width El ancho máximo del dispositivo de salida (pantalla).
max-height El ancho máximo de la ventana del navegador.
max-monochrome El máximo de bits por color en un dispositivo monocromo.
max-resolution El máximo de resolución del dispositivo de salida, se obtiene en dpi o dpcm.
max-width La altura máxima de la ventana del navegador.
min-aspect-ratio La relación mínima entre la anchura y la altura de la vista (espacio de la ventana cliente / viewport).
min-color El número mínimo de bits por canal de color del dispositivo de salida (pantalla).
min-color-index El número mínimo colores que puede mostrar el dispositivo de salida (pantalla).
min-device-aspect-ratio El mínimo de relación entre la altura y el ancho del dispositivo de salida (pantalla).
min-device-height La altura mínima del dispositivo de salida (pantalla).
min-device-width El ancho mínimo del dispositivo de salida (pantalla).
min-height El ancho mínimo de la ventana del navegador.
min-monochrome El mínimo de bits por color en un dispositivo monocromo.
min-resolution El mínimo de resolución del dispositivo de salida, se obtiene en dpi o dpcm.
min-width La altura mínima de la ventana del navegador.
monochrome El número de bits por color en un dispositivo monocromo.
resolution La resolución del dispositivo de salida, se obtiene en dpi o dpcm.
scan El proceso de escaneado del dispositivo de salida.
update-frequency Con que velocidad puede el dispositivo de salida modificar la apariencia del contenido (añadido en MediaQueries nivel 4).
width El ancho de la ventana cliente / viewport.

Código de ejemplo



Compatibilidad

Esta regla es soportada por todos los navegadores compatibles con CSS3.

Soportado a partir de la versión 1
Soportado a partir de la versión 1
Soportado a partir de la versión 9.2
Soportado a partir de la versión 1.3
Soportado a partir de la versión 9

Documento modificado por última vez : 23/12/2015
Ejemplo modificado por última vez : 12/02/2016

Enlaces relacionados