tutoriais mais recente desenvolvimento web
 

HTML <source> media Attribute

<HTML <source> tag

Exemplo

Use da media atributo:

<source src="movie.ogg" type="video/ogg"
media="screen and (min-width:320px)">
Tente você mesmo "

Definição e Uso

A media atributo especifica o tipo de recurso de mídia (o que a mídia / dispositivo o arquivo é otimizado para).

O navegador pode usar esse atributo para determinar se ele pode reproduzir o arquivo ou não. Se ele não pode, ele pode optar por não fazer o download.

Nota: Este atributo pode aceitar vários valores.


Suporte a navegadores

Atributo
media Não suportado Não suportado Não suportado Não suportado Não suportado

Diferenças entre HTML 4.01 e HTML5

O <source> tag é novo em HTML5.


Sintaxe

<source media="value">

possíveis Operators

Valor Descrição
and Especifica um operador AND
not Especifica um operador NOT
, Especifica um operador OR

Devices

Valor Descrição
all Apropriado para todos os dispositivos. Este é o padrão
aural sintetizadores de voz
braille dispositivos de realimentação Braille
handheld dispositivos portáteis (tela pequena, largura de banda limitada)
projection projetores
print / páginas impressas modo de visualização de impressão
screen telas de computador
tty Teletypes e meios de comunicação similares usando uma grade de caracteres de passo fixo
tv dispositivos do tipo televisão (baixa resolução, capacidade de deslocamento limitado)

valores

Valor Descrição
width Especifica a largura da área de exibição de alvo.
"min-" e "max-" prefixos pode ser usado.
Exemplo: media="screen and (min-width:500px)"
height Especifica a altura da área de exposição alvo.
"min-" e "max-" prefixos pode ser usado.
Example: media="screen and (max-height:700px)"
class = "notranslate" device-width Especifica a largura do alvo de exibição / papel.
"min-" e "max-" prefixos pode ser usado.
Exemplo: media="screen and (device-width:500px)"
device-height Especifica a altura do alvo display / papel.
"min-" e "max-" prefixos pode ser usado.
Exemplo: media="screen and (device-height:500px)"
orientation Especifica a orientação do alvo visor / papel.
Valores possíveis: "portrait" ou "landscape"
Exemplo: media="all and (orientation: landscape)"
aspect-ratio Especifica a relação largura / altura da área de exibição de alvo.
"min-" e "max-" prefixos pode ser usado.
Exemplo: media="screen and (aspect-ratio:16/9)"
device-aspect-ratio Especifica a taxa de device-width / dispositivo de altura do alvo display / papel.
"min-" e "max-" prefixos pode ser usado.
Exemplo: media="screen and (aspect-ratio:16/9)"
color Especifica os bits por cor de exibição de destino.
"min-" e "max-" prefixos pode ser usado.
Exemplo: media="screen and (color:3)"
color-index Especifica o número de cores a exibição de destino pode manipular.
"min-" e "max-" prefixos pode ser usado.
Exemplo: media="screen and (min-color-index:256)"
monochrome Especifica os bits por pixel em um frame buffer monocromática.
"min-" e "max-" prefixos pode ser usado.
Exemplo: media="screen and (monochrome:2)"
resolution Especifica a densidade de pixels (dpi ou dpcm) do alvo display / papel.
"min-" e "max-" prefixos pode ser usado.
Exemplo: media="print and (resolution:300dpi)"
scan Especifica o método de verificação de uma tela de TV.
Os valores possíveis são "progressive" e "interlace" .
Exemplo: media="tv and (scan:interlace)"
grid Especifica se o dispositivo de saída é grade ou bitmap.
Os valores possíveis são "1" para o grid, e "0" caso contrário.
Exemplo: media="handheld and (grid:1)"

<HTML <source> tag