Atributo media de fonte

Objeto Source do HTML DOM

Definição e uso

media Define ou retorna o valor do atributo media do elemento <source>.

Atributo media do <source> Define o tipo de mídia do recurso de mídia (o arquivo é otimizado para quais mídias/dispositivos).

O navegador pode usar a propriedade media para determinar se pode reproduzir o arquivo. Se não puder, ele pode optar por não baixar.

Manual de referência do HTML:Etiqueta <source> do HTML

Exemplo

Retorna para quais mídias/dispositivos o arquivo é otimizado:

var x = document.getElementById("mySource").media;

Experimente pessoalmente

Sintaxe

Retornar a propriedade media:

sourceObject.media

Definir a propriedade media:

sourceObject.media = value

Notas:Esta propriedade pode aceitar múltiplos valores.

Operadores possíveis

Valor Descrição
and Operador AND.
not Operador NOT.
, Operador OR.

Dispositivo

Valor Descrição
all Apropriado para todos os dispositivos. Padrão.
aural Sintetizador de voz.
braille Dispositivo de feedback em braille.
handheld Dispositivos portáteis (tela pequena, largura de banda limitada).
projection Projetor
print Modo de visualização de impressão prévia / página de impressão.
screen Tela de computador.
tty Máquinas de teletipo e mídias semelhantes que usam uma grade de caracteres com espaçamento fixo.
tv Equipamentos de tipo de TV (baixa resolução, capacidade de rolagem limitada).

Valor do atributo

Valor Descrição
width

Determina a largura da área de exibição alvo.

Pode ser usado o prefixo "min-" e "max-".

Exemplo: media="screen and (min-width:500px)"
height

Determina a altura da área de exibição alvo.

Pode ser usado o prefixo "min-" e "max-".

Exemplo: media="screen and (max-height:700px)"
device-width

Determina a largura do monitor/papel alvo.

Pode ser usado o prefixo "min-" e "max-".

Exemplo: media="screen and (device-width:500px)"
device-height

Determina a altura do monitor/papel alvo.

Pode ser usado o prefixo "min-" e "max-".

Exemplo: media="screen and (device-height:500px)"
orientation

Determina a orientação do monitor/papel alvo.

Valores possíveis: "portrait" ou "landscape".

Exemplo: media="all and (orientation: landscape)"
aspect-ratio

Determina a relação largura/altura da área de exibição alvo.

Pode ser usado o prefixo "min-" e "max-".

Exemplo: media="screen and (aspect-ratio:16/9)"
device-aspect-ratio

Determina a relação largura/altura do dispositivo alvo/papel.

Pode ser usado o prefixo "min-" e "max-".

Exemplo: media="screen and (aspect-ratio:16/9)"
color

Determina o número de bits por cor do monitor alvo.

Pode ser usado o prefixo "min-" e "max-".

Exemplo: media="screen and (color:3)"
color-index

Determina o número de cores que o monitor alvo pode processar.

Pode ser usado o prefixo "min-" e "max-".

Exemplo: media="screen and (min-color-index:256)"
monochrome

Determina o número de bits por pixel no buffer de frame monocromático.

Pode ser usado o prefixo "min-" e "max-".

Exemplo: media="screen and (monochrome:2)"
resolution

Determina a densidade de pixels (dpi ou dpcm) do monitor/papel alvo.

Pode ser usado o prefixo "min-" e "max-".

Exemplo: media="print and (resolution:300dpi)"
scan

Determina o método de escaneamento do monitor de TV.

Os valores possíveis são "progressive" e "interlace".

Exemplo: media="tv and (scan:interlace)"
grid

Determina se o dispositivo de saída é grid ou bitmap.

Os valores possíveis para "grid" são "1", caso contrário, são "0".

Exemplo: media="handheld and (grid:1)"

Detalhes técnicos

Valor retornado: Valor de string que representa o tipo do recurso de mídia.

Suporte do navegador

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Suporte Suporte Suporte Suporte Suporte

Notas:No entanto, nenhum navegador principal suporta o atributo media do HTML.

Páginas relacionadas

Manual de referência do HTML:Atributo media do elemento <source> do HTML

Objeto Source do HTML DOM