Manual de referência HTML

大全 de tags HTML

Atributo media do estilo HTML

A propriedade media especifica o tipo de mídia para o qual o estilo CSS é direcionado/O dispositivo foi otimizado, este atributo é usado para especificar estilos para dispositivos especiais (por exemplo, iPhone), mídia de voz ou impressão.

　HTML <style> tag

Exemplo online

Especificar estilos para impressão:

Exemplo

<!DOCTYPE　html>
<html>
<head>
<meta　charset="utf-8>
<title>Uso do atributo source media no HTML-Tutorial básico(oldtoolbag.com)</title>
<style　media="print">
h1　{cor:#000000;}
p　{cor:#000000;}
body　{fundo-cor:#FFFFFF;}
</style>
</head>
<body>
<h1>oldtoolbag.com　Exemplo</h1>
<p>Se você imprimir esta página ou abri-la no modo de pré-visualização de impressão, verá que ela usa a tabela de estilos media="print" para a configuração de estilo. A tabela de estilos "print" contém texto preto em fundo branco.</p>
</body>
</html>

Teste e veja ‹/›

Compatibilidade do navegador

IEFirefoxOperaChromeSafari

Todos os navegadores populares suportam a propriedade media.

Definição e uso

A propriedade media especifica o tipo de mídia para o qual o estilo CSS é direcionado/O dispositivo foi otimizado.
Este atributo é usado para especificar estilos para dispositivos especiais (por exemplo, iPhone), mídia de voz ou impressa.
Dica: Este atributo pode aceitar múltiplos valores.

HTML 4.01 com HTML5Diferenças

Nenhum.

Sintaxe

<style media="value>

Operadores possíveis

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

dispositivo

Valor	Descrição
all	Padrão. Ajusta a todos os dispositivos.
aural	Sintetizador de voz.
braille	Dispositivo de feedback em braille para cegos.
handheld	Dispositivo portátil (tela pequena, largura de banda limitada).
projection	Projetor.
print	Modo de pré-visualização de impressão / Página impressa.
screen	Tela de computador (valor padrão).
tty	Teletipo e mídias semelhantes que usam grade de caracteres de largura fixa.
tv	Dispositivos de TV (baixa resolução, capacidade de rolagem de tela limitada).

Valor

Valor	Descrição
width	especificar a largura da área de exibição do monitor alvo pode usar "min-" e "max-" é prefixo. Exemplo: media="screen and (min-width:500px)"
height	especificar a altura da área de exibição do monitor alvo pode usar "min-" e "max-" é prefixo. Exemplo: media="screen and (max-height:700px)"
device-width	Especificar o monitor alvo/largura do papel pode usar "min-" e "max-" é prefixo. Exemplo: media="screen and (device-width:500px)"
device-height	Especificar o monitor alvo/altura do papel pode usar "min-" e "max-" é prefixo. Exemplo: media="screen and (device-height:500px)"
orientation	Especificar o monitor alvo/direção do papel Valores possíveis: "portrait" ou "landscape" Exemplo: media="all and (orientation: landscape)"
aspect-ratio	especificar a largura da área de exibição do monitor alvo/height ratio pode usar "min-" e "max-" é prefixo. Exemplo: media="screen and (aspect-ratio:16/9)"
device-aspect-ratio	Especificar o monitor alvo/device da papel-width/device-height ratio pode usar "min-" e "max-" é prefixo. Exemplo: media="screen and (aspect-ratio:16/9)"
color	especificar bits do monitor alvo/color pode usar "min-" e "max-" é prefixo. Exemplo: media="screen and (color:3)"
color-index	Especificar o número de cores que o monitor alvo pode manipular. pode usar "min-" e "max-" é prefixo. Exemplo: media="screen and (min-color-index:256)"
monochrome	Especificar os bits no buffer de frame monocromático/pixel. pode usar "min-" e "max-" é prefixo. Exemplo: media="screen and (monochrome:2)"
resolution	Especificar o monitor alvo/densidade de pixels do papel (dpi ou dpcm). pode usar "min-" e "max-" é prefixo. Exemplo: media="print and (resolution:300dpi)"
scan	Especificar o modo de escaneamento do monitor de TV. Valores possíveis: "progressive" e "interlace". Exemplo: media="tv and (scan:interlace)"
grade	Especificar se o dispositivo de saída é grade ou bitmap. Valores possíveis:"1" é para grade, caso contrário é "0". Exemplo: media="handheld and (grid:1)"

　HTML <style> tag

HTML: <template> tag