Podemos definir o especificar el tipo de archivo multimedia (audio, video, etc.) en HTML mediante la etiqueta <source> . Define los recursos multimedia y le da al navegador tipos múltiples y alternativos de ese archivo multimedia entre los cuales el navegador puede elegir según su compatibilidad con ese tipo de medio.
Nota: El navegador elige el primer tipo de medio que admite de los tipos dados.
Sintaxis:
<source src="<media_file>.<media_file_extension>" type="<media_type>">
Ejemplo:
HTML
<!DOCTYPE html> <html> <head> <title>Defining media types</title> </head> <body> <h2>Welcome To GeeksforGeeks</h2> <audio controls> <source src="sound.wav" type="audio/ogg" /> <source src="sound.mp3" type="audio/mpeg" /> </audio> </body> </html>
Producción:
sonido.wav
En este ejemplo, se incluyen dos etiquetas de origen para dos tipos de archivos de audio, es decir, ‘ wav ‘ y ‘ mp3 ‘ . Si el navegador admite archivos de audio wav , solo reproducirá el audio de esa fuente; si no, buscará la siguiente opción, que es el tipo de audio mp3 .
Si ninguno de los tipos de audio es compatible con el navegador, no se selecciona ninguna fuente de audio. De lo contrario, se seleccionará el primer tipo de audio del pedido como fuente de audio. Y el tipo es el atributo que define el tipo de recurso.
Ejemplo:
HTML
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> </head> <body> <h1 style="color: green"> GeeksforGeeks </h1> <picture> <source srcset="gfg.png" /> <source srcset="gfg.jpg" /> <img src="gfg.jpg" /> </picture> </body> </html>
Producción:
gfg.png