Los últimos tutoriales de desarrollo web
 

HTML <source> media Attribute

<HTML <source> etiqueta

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
print 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)"

<HTML <source> etiqueta