Ejemplo
Utilice de la media de atributos:
<source src="movie.ogg" type="video/ogg"
media="screen and (min-width:320px)">
Inténtalo tú mismo " Definición y Uso
La media atributo especifica el tipo de recurso multimedia (lo que los medios de comunicación / dispositivo el archivo está optimizado para).
El navegador puede utilizar este atributo para determinar si se puede reproducir el archivo o no. Si no puede, se puede optar por no descargarlo.
Nota: Este atributo puede aceptar varios valores.
Soporte para el navegador
Atributo | |||||
---|---|---|---|---|---|
media | No soportado | No soportado | No soportado | No soportado | No soportado |
Diferencias entre HTML 4.01 y HTML5
La <source> etiqueta es nueva en HTML5.
Sintaxis
<source media="value">
posibles Operators
Valor | Descripción |
---|---|
and | Especifica un operador AND |
not | Especifica un operador NOT |
, | Especifica un operador OR |
dispositivos
Valor | Descripción |
---|---|
all | Conveniente para todos los dispositivos. Esto es por defecto |
aural | Los sintetizadores de voz |
braille | dispositivos de retroalimentación braille |
handheld | Los dispositivos de mano (pequeña pantalla, ancho de banda limitado) |
projection | proyectores |
Modo de vista previa de impresión / páginas impresas | |
screen | Las pantallas de ordenador |
tty | Teletipos y medios similares utilizando una cuadrícula de caracteres de paso fijo |
tv | dispositivos de tipo televisión (baja resolución, capacidad de desplazamiento limitado) |
Valores
Valor | Descripción |
---|---|
width | Especifica el ancho del área de visualización de destino. "min-" y "max-" prefijos pueden ser utilizados. Ejemplo: media="screen and (min-width:500px)" |
height | Especifica la altura del área de visualización de destino. "min-" y "max-" prefijos pueden ser utilizados. Example: media="screen and (max-height:700px)" |
class = "notranslate" dispositivo de ancho | Especifica el ancho de la pantalla de destino / papel. "min-" y "max-" prefijos pueden ser utilizados. Ejemplo: media="screen and (device-width:500px)" |
device-height | Especifica la altura de la meta de pantalla / papel. "min-" y "max-" prefijos pueden ser utilizados. Ejemplo: media="screen and (device-height:500px)" |
orientation | Especifica la orientación del objetivo de visualización / papel. Valores posibles: "portrait" o "landscape" Ejemplo: media="all and (orientation: landscape)" |
aspect-ratio | Especifica la relación de anchura / altura de la zona de visualización de destino. "min-" y "max-" prefijos pueden ser utilizados. Ejemplo: media="screen and (aspect-ratio:16/9)" |
device-aspect-ratio | Especifica la relación de dispositivo de anchura / dispositivo de altura del objetivo de visualización / papel. "min-" y "max-" prefijos pueden ser utilizados. Ejemplo: media="screen and (aspect-ratio:16/9)" |
color | Especifica los bits por color de visualización de destino. "min-" y "max-" prefijos pueden ser utilizados. Ejemplo: media="screen and (color:3)" |
color-index | Especifica el número de colores de la pantalla de destino puede manejar. "min-" y "max-" prefijos pueden ser utilizados. Ejemplo: media="screen and (min-color-index:256)" |
monochrome | Especifica los bits por pixel en una memoria intermedia de cuadros en blanco y negro. "min-" y "max-" prefijos pueden ser utilizados. Ejemplo: media="screen and (monochrome:2)" |
resolution | Especifica la densidad de píxeles (ppp o DPCM) de la meta de pantalla / papel. "min-" y "max-" prefijos pueden ser utilizados. Ejemplo: media="print and (resolution:300dpi)" |
scan | Especifica el método de barrido de una pantalla de televisión. Los valores posibles son "progressive" y "interlace" . Ejemplo: media="tv and (scan:interlace)" |
grid | Especifica si el dispositivo de salida es de rejilla o de mapa de bits. Los valores posibles son "1" para la red, y el "0" de otra manera. Ejemplo: media="handheld and (grid:1)" |