AdNow
loading...
Video HTML5
- Obtener vínculo
- X
- Correo electrónico
- Otras apps
Video HTML5
Reproducción de videos en HTML
Antes de HTML5, un video solo podía reproducirse en un navegador con un complemento (como flash).
El elemento HTML5 <video> especifica una forma estándar de insertar un video en una página web.
Soporte del navegador
Los números en la tabla especifican la primera versión del navegador que admite completamente el elemento <video>.
Element | |||||
---|---|---|---|---|---|
<video> | 4.0 | 9.0 | 3.5 | 4.0 | 10.5 |
El elemento HTML <video>
Para mostrar un video en HTML, use el elemento <video> :
Ejemplo
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
Pruebelo usted mismo »Cómo funciona
El atributo de controles agrega controles de video, como reproducción, pausa y volumen.
Es una buena idea incluir siempre atributos de ancho y alto . Si el alto y el ancho no están configurados, la página puede parpadear mientras se carga el video.
El elemento <origen> le permite especificar archivos de video alternativos de los cuales el navegador puede elegir. El navegador usará el primer formato reconocido.
El texto entre las etiquetas <video> y </ video> solo se mostrará en navegadores que no sean compatibles con el elemento <video>.
HTML <video> Reproducción automática
Para comenzar un video automáticamente use el atributo de reproducción automática :
Ejemplo
<video width="320" height="240" autoplay>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
Pruebelo usted mismo »
El atributo de reproducción automática no funciona en dispositivos móviles como iPad y iPhone.
Video HTML - Soporte del navegador
En HTML5, hay 3 formatos de video admitidos: MP4, WebM y Ogg.
El soporte del navegador para los diferentes formatos es:
Browser | MP4 | WebM | Ogg |
---|---|---|---|
Internet Explorer | YES | NO | NO |
Chrome | YES | YES | YES |
Firefox | YES | YES | YES |
Safari | YES | NO | NO |
Opera | YES (from Opera 25) | YES | YES |
HTML Video - Media Types
File Format | Media Type |
---|---|
MP4 | video/mp4 |
WebM | video/webm |
Ogg | video/ogg |
Video HTML - Métodos, propiedades y eventos
HTML5 define los métodos DOM, las propiedades y los eventos para el elemento <video>.
Esto le permite cargar, reproducir y pausar videos, así como establecer la duración y el volumen.
También hay eventos DOM que pueden avisarle cuando un video comienza a reproducirse, está en pausa, etc.
Para obtener una referencia completa de DOM, vaya a nuestra Referencia de DOM de audio / video HTML5 .
Etiquetas de video HTML5
Tag | Description |
---|---|
<video> | Defines a video or movie |
<source> | Defines multiple media resources for media elements, such as <video> and <audio> |
<track> | Defines text tracks in media players |
- Obtener vínculo
- X
- Correo electrónico
- Otras apps
Formulario de contacto
Entradas más populares de este blog
Listado pasaporte y cedulas SAIME 2018
click aqui para descargar el listado en formato pdf 21 de Julio de 2018 Con el propósito de dar celeridad al proceso de entrega de documentos, el Director General del Servicio Administrativo de Identificación, Migración y Extranjería (Saime), Gustavo Vizcaíno Gil, ordenó habilitar todas las oficinas del país los días sábados, únicamente para la entrega de cédulas y pasaportes. Saime abre sus oficinas los días sábados Con el propósito de dar celeridad al proceso de entrega de documentos, el Director General del Servicio Administrativo de Identificación, Migración y Extranjería (Saime), Gustavo Vizcaíno Gil, ordenó habilitar todas las oficinas del país los días sábados, únicamente para la entrega de cédulas y pasaportes. Los usuarios podrán ingresar en la página web del Saime www.saime.gob.ve y verificar si están en el listado donde le indicará en que oficina pueden retirar sus documentos de identificación. Esta iniciativa da cumplimiento a la sép...
Etiqueta HTML < abbr >
Etiqueta HTML <abbr> ❮ Referencia HTML completa anterior Siguiente ❯ Ejemplo Una abreviatura se marca de la siguiente manera: The < abbr title ="World Health Organization" > WHO < /abbr > was founded in 1948. Pruebelo usted mismo » Definición y uso La etiqueta <abbr> define una abreviatura o un acrónimo, como "Sr.", "Dec.", "ASAP", "ATM". Sugerencia: una abreviatura y un acrónimo son versiones abreviadas de otra cosa. Ambos a menudo se representan como una serie de letras. Marcar las abreviaturas puede proporcionar información útil para navegadores, sistemas de traducción y motores de búsqueda. Soporte del navegador Element <abbr> Yes Yes Yes Yes Yes Consejos y notas Consejo: El atributo de título global se puede usar en la etiqueta <abbr> para mostrar la versión completa de la abreviatura / acrónimo al pasar el mouse sobre el elemento <abbr>. Difere...
HTML < a > tag
HTML <a> día ❮ Referencia HTML completa anterior Siguiente ❯ Ejemplo Un enlace a W3Schools.com: < a href ="https://www.w3schools.com" > Visit W3Schools.com! < /a > Pruebelo usted mismo » More "Pruebelo usted mismo" examples below. Definición y uso La etiqueta <a> define un hipervínculo, que se usa para vincular de una página a otra. El atributo más importante del elemento <a> es el atributo href, que indica el destino del enlace. Por defecto, los enlaces aparecerán de la siguiente manera en todos los navegadores: Un enlace no visitado está subrayado y azul Un enlace visitado está subrayado y morado Un enlace activo está subrayado y rojo Soporte del navegador Element <a> Yes Yes Yes Yes Yes Consejos y notas Sugerencia: los siguientes atributos: descarga, hreflang, medios, rel, destino y tipo no pueden estar presentes si el atributo href no está presente. Consejo: Normalmente,...