Atributo media <a> do HTML
Definição e uso
media O atributo especifica qual tipo de mídia ou dispositivo o documento de link está otimizado.
Este atributo é usado para determinar se a URL de destino é projetada para dispositivos especiais (como iPhone), voz ou mídia impressa.
Este atributo pode aceitar múltiplos valores.
Só pode ser Atributo href Usado quando presente.
Atenção:Este atributo é puramente recomendado.
Exemplo
Definição de link com atributo media:
<a href="att_a_media.asp?output=print" media="print and (resolution:300dpi)"> Abra a página de atributos media para impressão </a>
Sintaxe
<a media="valor>
Operadores possíveis
| Operadores | Descrição |
|---|---|
| and | Define o operador AND. |
| not | Define o operador NOT. |
| , | Define o operador OR. |
Dispositivo
| Valor | Descrição |
|---|---|
| all | Padrão. Apropriado para todos os dispositivos. |
| aural | Sintetizador de voz. |
| braille | Dispositivo de feedback em braile. |
| handheld | Dispositivos portáteis (pequena tela, largura de banda limitada). |
| projection | Projetor. |
| Modo de pré-visualização de impressão/página de impressão. | |
| screen | Tela de computador. |
| tty | Teletipo e outros meios que usam uma grade de caracteres de largura fixa. |
| tv | Dispositivos de tipo TV (baixa resolução, capacidade de paginação limitada). |
Valor
| Valor | Descrição |
|---|---|
| width |
Define a largura da área de exibição alvo. Prefixos "min-" e "max-" podem ser usados. Exemplo: media="screen and (min-width:500px)" |
| height |
Define a altura da área de exibição alvo. Prefixos "min-" e "max-" podem ser usados. Exemplo: media="screen and (max-height:700px)" |
| device-width |
Define a largura do monitor/papel alvo. Prefixos "min-" e "max-" podem ser usados. Exemplo: media="screen and (device-width:500px)" |
| device-height |
Define a altura do monitor/papel alvo. Prefixos "min-" e "max-" podem ser usados. Exemplo: media="screen and (device-height:500px)" |
| orientation |
Define a orientação do monitor/papel alvo. Valores possíveis: "portrait" ou "landscape" Exemplo: media="all and (orientation: landscape)" |
| aspect-ratio |
Define a proporção largura/altura da área de exibição alvo. Prefixos "min-" e "max-" podem ser usados. Exemplo: media="screen and (aspect-ratio:16/9)" |
| device-aspect-ratio |
Define a proporção device-width/device-height do monitor/papel alvo. Prefixos "min-" e "max-" podem ser usados. Exemplo: media="screen and (aspect-ratio:16/9)" |
| color |
Define o número de bits de cada cor do monitor alvo. Prefixos "min-" e "max-" podem ser usados. Exemplo: media="screen and (color:3)" |
| color-index |
Define o número de cores que o monitor alvo pode processar. Prefixos "min-" e "max-" podem ser usados. Exemplo: media="screen and (min-color-index:256)" |
| monochrome |
Define o número de bits por pixel em um buffer de frame monocromático. Prefixos "min-" e "max-" podem ser usados. Exemplo: media="screen and (monochrome:2)" |
| resolution |
Define a densidade de pixels do monitor/papel alvo (dpi ou dpcm). Prefixos "min-" e "max-" podem ser usados. Exemplo: media="print and (resolution:300dpi)" |
| scan |
Define o método de escaneamento do monitor de TV. Valores possíveis são: "progressive" e "interlace". Exemplo: media="tv and (scan:interlace)" |
| grade |
Define se o dispositivo de saída é uma grade ou bitmap. Valores possíveis: "1" representa a grade, "0" representa outros. Exemplo: media="handheld and (grid:1)" |
Suporte ao navegador
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| Suporte | Suporte | Suporte | Suporte | Suporte |
