English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
O som pode ser reproduzido de várias maneiras no HTML.
Reproduzir áudio em HTML não é fácil!
Você precisa dominar muitas técnicas para garantir que seus arquivos de áudio possam ser reproduzidos em todos os navegadores (Internet Explorer, Chrome, Firefox, Safari, Opera) e em todos os dispositivos (PC, Mac, iPad, iPhone).
Neste capítulo, o tutorial básico resume problemas e soluções.
O plug-in é um pequeno programa de computador que expande as funções padrão do navegador.
Plug-ins podem ser adicionados à página usando a tag <object> ou <embed>.
Essas tags definem contêineres para recursos (normalmente recursos não HTML), que são exibidos pelo navegador ou por plug-ins externos, dependendo do tipo.
A tag <embed> define um contêiner para conteúdo externo (não HTML). (Este é um HTML5 A tag4 é ilegal, mas funciona em todos os navegadores).
O código snippet a seguir pode exibir o MP incorporado na página web3 Arquivo:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Manual básico(oldtoolbag.com)</<title> </<head> <body> <object height="50" width="100" data="/correr/html/horse.mp3></object> <p>Se você não conseguir ouvir o áudio, talvez o seu computador ou navegador não suportem o formato do arquivo.</p> <p>ou você não abriu o alto-falante.</p> </body> </html>Teste e veja ‹/›
A tag <embed> no HTML 4 é inválido. A página não pode ser exibida por meio do HTML 4 Verificação.
Os navegadores suportam formatos de áudio diferentes.
Se o navegador não suportar o formato do arquivo e não houver plugin, o áudio não pode ser tocado.
Se o plugin não estiver instalado no computador do usuário, o áudio não pode ser tocado.
Se você converter esse arquivo para outro formato, ainda não será possível tocá-lo em todos os navegadores.
A tag <object tag> também pode definir um contêiner para conteúdo externo (não HTML).
O código snippet a seguir pode exibir o MP incorporado na página web3 Arquivo:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Manual básico(oldtoolbag.com)</<title> </<head> <body> <object height="50" width="100" data="/correr/html/horse.mp3></object> <p>Se você não conseguir ouvir o áudio, talvez o seu computador ou navegador não suportem o formato do arquivo.</p> <p>ou você não abriu o alto-falante.</p> </body> </html>Teste e veja ‹/›
Os navegadores suportam formatos de áudio diferentes.
Se o navegador não suportar o formato do arquivo e não houver plugin, o áudio não pode ser tocado.
Se o plugin não estiver instalado no computador do usuário, o áudio não pode ser tocado.
Se você converter esse arquivo para outro formato, ainda não será possível tocá-lo em todos os navegadores.
HTML5 A tag <audio> é um elemento HTML5 elemento, no HTML 4 é ilegal, mas funciona em todos os navegadores.
O elemento <audio> funciona em todos os navegadores modernos.
Compatibilidade do navegadoro número no formato indica a primeira versão do navegador que suporta essa propriedade.
| elemento | Chrome | IE | Firefox | Safari | Opera |
| <audio> | 4.0 | 9.0 | 3.5 | 4.0 | 10.5 |
A seguir, usaremos a tag <audio> para descrever MP3 arquivo (válido no Internet Explorer, Chrome e Safari), também adicionou um arquivo do tipo OGG (válido no Firefox e Opera navegadores). Se falhar, ele exibirá uma mensagem de erro de texto:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Manual básico(oldtoolbag.com)</<title> </<head> <body> <audio controls> <source src="/correr/html/horse.mp3" type="audio/mpeg"> <source src="/correr/html/horse.ogg" type="audio/ogg"> Seu navegador não suporta esse formato de áudio. </audio> </body> </html>Teste e veja ‹/›
A tag <audio> no HTML 4 é inválido. A sua página não pode ser exibida por meio do HTML 4 Verificação.
Você deve converter o arquivo de áudio para um formato diferente.
O elemento <audio> não funciona em navegadores antigos.
O exemplo a seguir usa dois formatos de áudio diferentes. HTML5 O elemento <audio> tentará reproduzir o áudio com mp3 ou ogg para reproduzir o áudio. Se falhar, o código tentará recuar para o elemento <embed>.
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Manual básico(oldtoolbag.com)</<title> </<head> <body> <audio controls> <source src="/correr/html/horse.mp3" type="audio/mpeg"> <source src="/correr/html/horse.ogg" type="audio/ogg"> <embed height="50" width="100" src="/correr/html/horse.mp3"> </audio> </body> </html>Teste e veja ‹/›
Você precisa converter o áudio para um formato diferente.
O elemento <embed> não pode recuar para exibir mensagens de erro.
Se a página da web contiver links para arquivos de mídia, a maioria dos navegadores usará um "aplicativo auxiliar" para reproduzir o arquivo.
O código fragmento a seguir mostra um link para mp3 Link para o arquivo. Se o usuário clicar no link, o navegador iniciará um "aplicativo auxiliar" para reproduzir o arquivo:
<a href="/correr/html/horse.mp3">Reproduzir o som</a>Teste e veja ‹/›
Quando você inclui som na página ou como parte da página, ele é chamado de som em linha.
Se você planeja usar som em linha em aplicativos web, você precisa estar ciente de que muitos acham que o som em linha é irritante. Além disso, observe que o usuário pode ter desativado a opção de som em linha no navegador.
A nossa melhor recomendação é incluir apenas onde o usuário deseja ouvir som em linha. Um exemplo positivo é, quando o usuário precisa ouvir uma gravação e clicar em um link, a página abre e a gravação é reproduzida.
New: HTML5 Nova etiqueta
| Etiqueta | Descrição |
| <embed> | Define o objeto embutido. HTML4 Desaconselhado, HTML5 Permitido. |
| <object> | Define o objeto embutido. |
| <param> | Define os parâmetros do objeto. |
| <audio>HTML5 | Define o conteúdo de som |
| <video>HTML5 | Define um vídeo ou filme |
| <source>HTML5 | Definiu os recursos multimídia do elemento media (<video> e <audio>) |
| <track>HTML5 | Define o arquivo de legendas do elemento media ou outros arquivos que contêm texto (video e audio) |