Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Aprende Incrustación de Audio y Video para Contenido Multimedia Enriquecido | Trabajando con Medios y Tablas
HTML Definitivo

bookIncrustación de Audio y Video para Contenido Multimedia Enriquecido

Inserción de audio

Se puede utilizar el elemento <audio> para incluir archivos de audio en una página web. Consideremos un ejemplo:

index.html

index.html

copy

En este ejemplo:

  • El elemento <audio> contiene un elemento <source>, que especifica la URL y el tipo de archivo de audio. Los formatos comúnmente soportados son MP3 y OGG;
  • El atributo controls muestra los controles estándar de reproducción como reproducir, pausar y volumen;
  • Si el navegador del usuario no admite el elemento de audio, se mostrará un mensaje alternativo.

Atributos adicionales comúnmente utilizados con el elemento de audio en HTML incluyen:

  • autoplay: inicia la reproducción del archivo de audio tan pronto como se carga la página;
  • loop: hace que el archivo de audio se repita de forma continua;
  • muted: silencia el audio por defecto;
  • volume: especifica el nivel de volumen predeterminado para el archivo de audio, con un rango de 0.0 (silencio) a 1.0 (volumen máximo).

A continuación se muestra un ejemplo que demuestra el uso de todos estos atributos:

index.html

index.html

copy

Inserción de video

Es posible insertar archivos de video en una página web utilizando el elemento <video>. Considere el siguiente ejemplo:

index.html

index.html

copy

En este ejemplo:

  • El elemento <video> contiene un elemento <source>, que especifica la URL y el tipo de archivo del video. Los formatos comúnmente soportados son WebM, MP4 y OGG;
  • El atributo controls muestra los controles estándar de reproducción;
  • Si el navegador del usuario no admite el elemento de video, se mostrará un mensaje alternativo.

Atributos comúnmente utilizados para el elemento de video en HTML incluyen:

  • autoplay: inicia la reproducción del archivo de video tan pronto como la página se carga;
  • loop: hace que el archivo de video se reproduzca en bucle de forma continua;
  • muted: silencia el audio por defecto;
  • volume: especifica el nivel de volumen predeterminado para el archivo de audio, con un rango de 0.0 (silencio) a 1.0 (volumen máximo);
  • poster: especifica la URL de una imagen que se muestra como miniatura del video antes de que se reproduzca;
  • width y height: especifica el ancho y la altura del reproductor de video en píxeles.

A continuación se muestra un ejemplo que demuestra el uso de todos estos atributos:

index.html

index.html

copy

Nota

Además, existen muchas bibliotecas y APIs de JavaScript disponibles que proporcionan funcionalidades adicionales para la reproducción y manipulación de contenido de video en la web.

question mark

¿Cuál de las siguientes afirmaciones sobre los elementos <audio> y <video> en HTML es verdadera?

Select the correct answer

¿Todo estuvo claro?

¿Cómo podemos mejorarlo?

¡Gracias por tus comentarios!

Sección 4. Capítulo 5

Pregunte a AI

expand

Pregunte a AI

ChatGPT

Pregunte lo que quiera o pruebe una de las preguntas sugeridas para comenzar nuestra charla

Suggested prompts:

Can you show me a complete example of embedding both audio and video on a web page?

What are some best practices for using audio and video elements in HTML?

Can you explain how to use JavaScript to control audio or video playback?

Awesome!

Completion rate improved to 2.56

bookIncrustación de Audio y Video para Contenido Multimedia Enriquecido

Desliza para mostrar el menú

Inserción de audio

Se puede utilizar el elemento <audio> para incluir archivos de audio en una página web. Consideremos un ejemplo:

index.html

index.html

copy

En este ejemplo:

  • El elemento <audio> contiene un elemento <source>, que especifica la URL y el tipo de archivo de audio. Los formatos comúnmente soportados son MP3 y OGG;
  • El atributo controls muestra los controles estándar de reproducción como reproducir, pausar y volumen;
  • Si el navegador del usuario no admite el elemento de audio, se mostrará un mensaje alternativo.

Atributos adicionales comúnmente utilizados con el elemento de audio en HTML incluyen:

  • autoplay: inicia la reproducción del archivo de audio tan pronto como se carga la página;
  • loop: hace que el archivo de audio se repita de forma continua;
  • muted: silencia el audio por defecto;
  • volume: especifica el nivel de volumen predeterminado para el archivo de audio, con un rango de 0.0 (silencio) a 1.0 (volumen máximo).

A continuación se muestra un ejemplo que demuestra el uso de todos estos atributos:

index.html

index.html

copy

Inserción de video

Es posible insertar archivos de video en una página web utilizando el elemento <video>. Considere el siguiente ejemplo:

index.html

index.html

copy

En este ejemplo:

  • El elemento <video> contiene un elemento <source>, que especifica la URL y el tipo de archivo del video. Los formatos comúnmente soportados son WebM, MP4 y OGG;
  • El atributo controls muestra los controles estándar de reproducción;
  • Si el navegador del usuario no admite el elemento de video, se mostrará un mensaje alternativo.

Atributos comúnmente utilizados para el elemento de video en HTML incluyen:

  • autoplay: inicia la reproducción del archivo de video tan pronto como la página se carga;
  • loop: hace que el archivo de video se reproduzca en bucle de forma continua;
  • muted: silencia el audio por defecto;
  • volume: especifica el nivel de volumen predeterminado para el archivo de audio, con un rango de 0.0 (silencio) a 1.0 (volumen máximo);
  • poster: especifica la URL de una imagen que se muestra como miniatura del video antes de que se reproduzca;
  • width y height: especifica el ancho y la altura del reproductor de video en píxeles.

A continuación se muestra un ejemplo que demuestra el uso de todos estos atributos:

index.html

index.html

copy

Nota

Además, existen muchas bibliotecas y APIs de JavaScript disponibles que proporcionan funcionalidades adicionales para la reproducción y manipulación de contenido de video en la web.

question mark

¿Cuál de las siguientes afirmaciones sobre los elementos <audio> y <video> en HTML es verdadera?

Select the correct answer

¿Todo estuvo claro?

¿Cómo podemos mejorarlo?

¡Gracias por tus comentarios!

Sección 4. Capítulo 5
some-alt