Conteúdo do Curso
HTML Definitivo
HTML Definitivo
Incorporação de Áudio e Vídeo para Conteúdo Multimídia Avançado
Incorporação de Áudio
É possível utilizar o elemento <audio>
para incluir arquivos de áudio em uma página web. Veja o exemplo a seguir:
index.html
Neste exemplo:
- O elemento
<audio>
contém um elemento<source>
, que especifica a URL e o tipo de arquivo de áudio. Os formatos mais comumente suportados são MP3 e OGG; - O atributo
controls
exibe controles padrão de reprodução, como reproduzir, pausar e ajustar o volume; - Caso o navegador do usuário não ofereça suporte ao elemento de áudio, será exibida uma mensagem alternativa.
Atributos adicionais comumente usados com o elemento de áudio HTML incluem:
autoplay
: inicia a reprodução do arquivo de áudio assim que a página é carregada;loop
: faz com que o arquivo de áudio seja reproduzido continuamente em loop;muted
: silencia o áudio por padrão;volume
: especifica o nível de volume padrão para o arquivo de áudio, variando de 0.0 (mudo) a 1.0 (volume máximo).
Veja um exemplo demonstrando o uso de todos esses atributos:
index.html
Incorporação de Vídeo
É possível incorporar arquivos de vídeo em uma página web utilizando o elemento <video>
. Considere o exemplo a seguir:
index.html
Neste exemplo:
- O elemento
<video>
contém um elemento<source>
, que especifica a URL e o tipo de arquivo do vídeo. Os formatos comumente suportados são WebM, MP4 e OGG; - O atributo
controls
exibe controles padrão de reprodução; - Caso o navegador do usuário não ofereça suporte ao elemento de vídeo, será exibida uma mensagem alternativa.
Atributos comumente usados para o elemento de vídeo HTML incluem:
autoplay
: inicia a reprodução do arquivo de vídeo assim que a página é carregada;loop
: faz com que o arquivo de vídeo seja reproduzido continuamente em loop;muted
: silencia o áudio por padrão;volume
: especifica o nível de volume padrão para o arquivo de áudio, variando de 0.0 (mudo) a 1.0 (volume máximo);poster
: especifica a URL de uma imagem a ser exibida como miniatura do vídeo antes da reprodução;width
eheight
: especifica a largura e a altura do player de vídeo em pixels.
Veja um exemplo demonstrando o uso de todos esses atributos:
index.html
Nota
Além disso, existem muitas bibliotecas JavaScript e APIs disponíveis que fornecem funcionalidades adicionais para reprodução e manipulação de conteúdo de vídeo na web.
Obrigado pelo seu feedback!