Maison > Article > interface Web > Analyse détaillée de l'audio en HTML5

Analyse détaillée de l'audio en HTML5

寻∝梦original: 2018-08-13 18:21:082066parcourir

Il y a beaucoup de nouveautés en HTML5, qui sont quelque peu différentes de l'ancienne version. Cet article donnera une analyse détaillée des nouveaux éléments audio en HTML5

HTML5 Audio (audio)

Dernière modification le 1er août 2017

HTML5 fournit un standard pour la lecture des fichiers audio.

L'audio sur Internet

Jusqu'à présent, il n'existait aucune norme pour la lecture audio sur les pages Web.

Aujourd'hui, la plupart des fichiers audio sont lus via des plug-ins (tels que Flash). Cependant, tous les navigateurs ne disposent pas des mêmes plugins.

HTML5 spécifie une norme pour l'intégration d'éléments audio dans des pages Web, à l'aide de l'élément b97864c2e0ef2353a16c4d64c7734e92

Prise en charge des navigateurs

Internet Explorer 9+, Firefox, Opera, Chrome et Safari prennent tous en charge l'élément b97864c2e0ef2353a16c4d64c7734e92.

Remarque : Internet Explorer 8 et versions antérieures. La version IE ne prend pas en charge l'élément b97864c2e0ef2353a16c4d64c7734e92

Audio HTML5 - Comment ça marche

Pour lire de l'audio en HTML5, vous devez utiliser le code suivant :

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>PHP中文网</title> 
</head>
<body>
<audio controls>
  <source src="/statics/demosource/horse.ogg" type="audio/ogg">
  <source src="/statics/demosource/horse.mp3" type="audio/mpeg">

Votre navigateur ne prend pas en charge l'élément audio.

81d2bc32cafa2076a27f10cdd878d0ab

36cc49f0c466276486e50c850b7e4956

73a6ac4ed44ffec12cee46588e518a5e

l'attribut de contrôle est utilisé pour ajouter la lecture, la pause et le volume contrôles.

Entre b97864c2e0ef2353a16c4d64c7734e92 et 81d2bc32cafa2076a27f10cdd878d0ab, vous devez insérer le texte d'invite de l'élément b97864c2e0ef2353a16c4d64c7734e92 L'élément

b97864c2e0ef2353a16c4d64c7734e92 permet l'utilisation de plusieurs éléments e02da388656c3265154666b7c71a8ddc > Formats audio et prise en charge du navigateur

Actuellement, l'élément b97864c2e0ef2353a16c4d64c7734e92 prend en charge trois fichiers de format audio : MP3, Wav et Ogg ;

Types de formats audio MIME : MP3, Ogg, Wav. ;

Balise HTML5Audio :

b97864c2e0ef2353a16c4d64c7734e92 définit le contenu sonore

e02da388656c3265154666b7c71a8ddc la balise

b97864c2e0ef2353a16c4d64c7734e92 utilisée dans la balise b97864c2e0ef2353a16c4d64c7734e92 :

autoplay : Si cet attribut apparaît, l'audio sera joué dès qu'il sera prêt.

contrôles : Si cet attribut apparaît, des contrôles sont affichés à l'utilisateur, comme un bouton de lecture.

boucle : Si cet attribut est présent, la lecture redémarrera à chaque fin de l'audio.

preload : Si cet attribut apparaît, l'audio sera chargé lorsque la page sera chargée et préparée pour la lecture. Si "autoplay" est utilisé, cet attribut est ignoré.

src : URL de l'audio à lire.

L'exemple ci-dessus utilise un fichier Ogg et convient aux navigateurs Firefox, Opera et Chrome.

<audio> 与 </audio> 之间插入的内容是供不支持 audio 元素的浏览器显示的：
<audio src="song.ogg" controls="controls">
Your browser does not support the audio tag.
</audio>

Pour garantir son fonctionnement avec Safari, le fichier audio doit être de type MP3 ou Wav. L'élément

audio autorise plusieurs éléments sources. L'élément source peut lier différents fichiers audio. Le navigateur utilisera le premier format reconnu :

[Recommandations associées]

<audio controls="controls">
  <source src="song.ogg" type="audio/ogg">
  <source src="song.mp3" type="audio/mpeg">
Your browser does not support the audio tag.
</audio>

Les éléments de base du HTML, permettant d'apprendre le HTML à partir de zéro

Analyse en HTML5

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

html5 firefox chrome safari html

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Le chemin pour apprendre HTML5Article suivant：Le chemin pour apprendre HTML5

Articles Liés

Voir plus