Curso de HTML
Construye la estructura de la web.
Aprende cada etiqueta con ejemplos interactivos y crea proyectos reales.
La etiqueta <video> incrusta un reproductor de video nativo. Comparte casi todos los atributos de <audio>, más algunos propios como poster y las dimensiones del reproductor.
Explicación
La etiqueta <video> comparte casi todos los atributos de <audio>, más un par propios:
controlsIgual que en <audio>: muestra los controles nativos del navegador.
width / heightDefinen el tamaño del reproductor dentro de la página.
posterImagen que se muestra antes de que el video empiece a reproducirse.
muted + autoplayCombinación necesaria para que el navegador permita reproducir el video automáticamente al cargar la página.
loopRepite el video en bucle en cuanto termina.
Reto rápido
Este video tiene autoplay pero no se reproduce solo porque le falta muted. Agrégaselo.
En esta lección
- Ejemplo interactivo
- Explicación de cada etiqueta
- Cuándo usarlo
- Errores comunes
Consejo
Si necesitas autoplay (por ejemplo, un video de fondo decorativo), agrega siempre muted: sin sonido, casi todos los navegadores lo permiten.
Dato extra
Igual que con <audio>, puedes usar varias etiquetas <source> con distintos formatos (mp4, webm) para que el navegador elija el que soporte.
Error común
Poner autoplay sin muted esperando que el video se reproduzca solo: el navegador lo ignora en silencio y el video se queda pausado en el primer cuadro.
Siguiente paso
Ya sabes incrustar audio y video propios. La última pieza de multimedia es el <iframe>, que incrusta contenido de otra página dentro de la tuya.
Ir a la siguiente lección