Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Apprendre Défi : Audio | Images et Médias
Essentiels HTML

book
Défi : Audio

Tâche

Créez un document HTML qui intègre deux extraits audio de la nature. Ajoutez les attributs appropriés pour activer les contrôles.

  • L'URL du premier fichier audio est https://content-media-cdn.codefinity.com/courses/392f24ac-0126-4c34-a28a-f2f26d12196b/section-3/forest-with-small-river-birds-and-nature-field.mp3.
  • L'URL du second fichier audio est https://content-media-cdn.codefinity.com/courses/392f24ac-0126-4c34-a28a-f2f26d12196b/section-3/evening-birds-singing-in-spring-background-sounds-of-nature.mp3.
html

index.html

copy
<!DOCTYPE html>
<html>
<head>
<title>Nature Sounds</title>
<meta charset="UTF-8" />
</head>
<body>
<h1>Nature Sounds</h1>
<ul>
<li>
<h2>Evening birds signing in spring.</h2>
<!-- Step 1: Embed the audio clip -->
<audio _____>
<source
src="_____"
type="audio/mpeg"
/>
Your browser does not support the audio element.
</audio>
</li>
<li>
<h2>A forest filled with small singing birds.</h2>
<!-- Step 1: Embed the audio clip -->
<_____ _____>
<source
src="_____"
type="audio/mpeg"
/>
Your browser does not support the audio element.
</_____>
</li>
</ul>
</body>
</html>

Indice

Étape 1 : Utilisez la balise <audio> pour intégrer le clip audio. Ajoutez l'attribut controls pour activer les contrôles audio standard. À l'intérieur de la balise <source>, utilisez l'attribut src pour spécifier les URL des fichiers audio MP3.

html

index.html

copy
<!DOCTYPE html>
<html>
<head>
<title>Nature Sounds</title>
<meta charset="UTF-8" />
</head>
<body>
<h1>Nature Sounds</h1>
<ul>
<li>
<h2>Evening birds signing in spring.</h2>
<!-- Step 1: Embed the audio clip -->
<audio controls>
<source
src="https://codefinity-content-media-v2.s3.eu-west-1.amazonaws.com/courses/392f24ac-0126-4c34-a28a-f2f26d12196b/section-3/forest-with-small-river-birds-and-nature-field.mp3"
type="audio/mpeg"
/>
Your browser does not support the audio element.
</audio>
</li>
<li>
<h2>A forest filled with small singing birds.</h2>
<!-- Step 1: Embed the audio clip -->
<audio controls>
<source
src="https://codefinity-content-media-v2.s3.eu-west-1.amazonaws.com/courses/392f24ac-0126-4c34-a28a-f2f26d12196b/section-3/evening-birds-singing-in-spring-background-sounds-of-nature.mp3"
type="audio/mpeg"
/>
Your browser does not support the audio element.
</audio>
</li>
</ul>
</body>
</html>

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 3. Chapitre 4
some-alt