Etiqueta video
La etiqueta video permite agregar video a una página HTML.
Con ella también se puede controlar este video.
La ruta al archivo de video se especifica mediante el
atributo src o la etiqueta anidada source.
Si desea ver un reproductor para controlar la reproducción
del video, debe agregar el atributo controls.
Sin él, no verá nada; tampoco habrá
sonido ni imagen.
A veces, alojar el video en el sitio web mismo no es
muy conveniente (por ejemplo, si su hosting tiene
una limitación en el tamaño del sitio). En este caso,
el video se puede subir a YouTube y insertar
utilizando la etiqueta iframe.
Atributos
| Atributo | Descripción |
|---|---|
src |
Especifica la ruta al archivo de video.
Pero es mejor usar la etiqueta source para esto
(en este caso, se podrá especificar el video en diferentes formatos).
|
preload |
Se utiliza para cargar el archivo de video simultáneamente con la carga de la página del sitio.
Valores aceptados: none (no cargar el archivo, por defecto),
metadata (cargar solo información de servicio: duración, etc.),
auto (cargar el video completo al cargar la página HTML).
|
autoplay |
El sonido comienza a reproducirse inmediatamente después de cargar la página,
en este caso, la presencia del atributo preload será ignorada.
Atributo sin valor. |
controls |
Agrega un panel de control al video.
Atributo sin valor. Por defecto (si no hay atributo) no se agrega el panel. |
loop |
Repite la grabación de audio en "bucle":
después de terminar, comenzará a reproducirse nuevamente.
Atributo sin valor. Por defecto (si no hay atributo) la grabación se reproducirá solo 1 vez.
|
poster |
Ruta a la imagen que se mostrará mientras el video no esté disponible o no se esté reproduciendo.
Si no se especifica el atributo poster, el navegador intentará mostrar el primer fotograma del video.
|
height |
El atributo height establece la altura del área de reproducción del video (en píxeles
o porcentajes).
El video mismo cambia su tamaño hacia arriba o hacia abajo, ajustándose a la altura dada,
pero sus proporciones no cambian.
Valor por defecto: la altura se toma de los parámetros del video, si este valor no está disponible, entonces el valor del atributo height
se considera igual a la altura de la imagen del atributo poster.
Si poster tampoco está especificado, la altura
se establece en 150 píxeles.
|
width |
El atributo width establece el ancho del área de reproducción del video (en píxeles
o porcentajes).
El video mismo cambia su tamaño hacia arriba o hacia abajo, ajustándose al ancho dado,
pero sus proporciones no cambian.
Valor por defecto: el ancho se toma de los parámetros del video, si este valor no está disponible, entonces el valor del atributo width
se considera igual al ancho de la imagen del atributo poster.
Si poster tampoco está especificado, el ancho
se establece en 150 píxeles.
|
Ejemplo . Reproductor en la página del sitio
Agreguemos un reproductor con video a la página.
Para aquellos navegadores que no admiten
la etiqueta video, se ha dejado un mensaje
especial al respecto:
<video src="moovie.mp4" controls>
Su navegador no admite video en HTML5.
</video>
Ejemplo .
Agreguemos la etiqueta source
a la etiqueta video:
<video>
<source src="moovie.mp4" controls>
Su navegador no admite video en HTML5.
</video>