source

Sumário

O elemento source é utilizado para especificar múltiplos recursos de mídia de elementos <picture><audio> ou <video> em HTML5. É um elemento vazio. É normalmente usado para disponibilizar multiple formats supported by different browsers.

Contexto de uso

Conteúdo permitido Nenhum; isso é um elemento vazio.
Omissão de tag Deve ter uma tag de início, mas não deve ter uma tag de fim.
Elementos pais permitidos <picture>, <audio>, <video>
Documento normativo HTML5, section 4.8.8

Atributos

Como todos os outros elementos de HTML, esse elemento suporta os global attributes.

src
Requerido, endereço do arquivo de mídia.
type
O tipo MIME do arquivo, opcionalmente com um parametro de codecs. Veja o RFC 4281 para informações sobre como especificar codec.
media
Definição do tipo de mídia (Media query) pretendido.

Se o atributo type não está especificado, o tipo da mídia é obtido no servidor e é verificado se o Gecko consegue reproduzi-lo; se não for possível reproduzi-lo, o próximo source é verificado. Se o atributo type está definido, ele é comparado aos tipos que o Gecko consegue reproduzir, e se não for reconhecido, o servido não é solicitado; ao invés disso, o próximo elemento source é verificado.

Interface do DOM

Esse elemento implementa a interface HTMLSourceElement.

Exemplos

Esse exemplo demonstra como oferecer um vídeo no formato Ogg para usuários em que os navegadores suporta o formato Ogg, e um formato QuickTime para os usuários que o suporta. Se os elementos audio ou video não forem suportados pelo navegador, um aviso será mostrado. Se o navegador suportar o elemento, mas não suportar nenhum dos formatos especificados, um evento de error será lançado e os controles padrões de mídia (se ativados) indicarão o erro. Veja também a lista de media formats supported by the audio and video elements em vários navegadores.

<video controls>
  <source src="foo.ogg" type="video/ogg"> <!-- Escolhido pelo Firefox -->
  <source src="foo.mov" type="video/quicktime"> <!-- Escolhido pelo Safari -->
  Desculpa; seu navegador não é compatível com vídeo em HTML5.
</video>

Para mais exemplos, veja Using audio and video in Firefox.

Compatibilidade dos Navegadores

Estamos convertendo nossos dados de compatibilidade para o formato JSON. Esta tabela de compatibilidade ainda usa o formato antigo, pois ainda não convertemos os dados que ela contém. Descubra como você pode ajudar! (en-US)

Recurso Chrome Firefox (Gecko) Internet Explorer Opera Safari
Suporte Básico (Yes) 3.5 (1.9.1) 9.0 (Yes) (Yes)
Atributo media (Yes) 15.0 (15.0) ? (Yes) (Yes)
Recurso Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Suporte básico (Yes) 1.0 (1.0) ? ? ?
Atributo media (Yes) 15.0 (15.0) ? ? ?

Notas específicas do Gecko

Atualmente, apenas um pequeno conjunto de funcionalidades está implementado — o Gecko escolhe o primeiro elemento source que tem um tipo correspondente the MIME-type of a supported media format; veja o bug 449363 para detalhes.