Maison > interface Web > tutoriel HTML > Introduction à l'utilisation des balises vidéo vidéo HTML5

Introduction à l'utilisation des balises vidéo vidéo HTML5

不言
Libérer: 2018-05-08 15:42:08
original
3051 Les gens l'ont consulté

Cet article présente principalement l'utilisation de la balise vidéo HTML5, qui a une certaine valeur de référence. Maintenant, je la partage avec tout le monde. Les amis dans le besoin peuvent s'y référer

La vidéo HTML est adaptée au HTML 5+, utilisation Pour définir les médias de streaming vidéo pour la visualisation en ligne, voici une brève introduction pour la commodité des amis qui en ont besoin

HTML

Copiez le code

Le code est le suivant :

<video width="320" height="240" src="http://www.jb51.net/movie.ogg" controls="controls">
Copier après la connexion

Voici le texte du commentaire, si le le navigateur ne prend pas en charge HTML 5. Le texte ici sera affiché. Si elle est prise en charge, la vidéo sera affichée directement et le texte sera ignoré.

Dans HTML 4 et versions antérieures, si vous souhaitez intégrer une vidéo pour une visualisation en ligne dans une page Web, vous devez généralement utiliser le streaming vidéo Flash, en utilisant < ;object> et la balise , vous pouvez lire des fichiers vidéo au format swf, flv et autres via le navigateur, mais le principe est que le navigateur doit installer un plug-in tiers : Adobe Flash Player. Les smartphones et iPads modernes ne prennent généralement pas en charge Flash et ne peuvent donc pas parcourir les vidéos sur le Web. HTML 5 a changé ce fait. Les développeurs Web n'ont besoin que d'utiliser la balise

AttributsValeurDescription
lecture automatiquelecture automatique Si cet attribut est présent, la vidéo sera lue dès qu'elle sera prête.
contrôlescontrôlesLe cas échéant, affiche les contrôles, tels qu'un bouton de lecture, à l'utilisateur.
hauteurValeur du pixel Définit la hauteur du lecteur vidéo.
looploopSi cet attribut apparaît, la lecture recommencera une fois la lecture du fichier multimédia terminée.
preloadauto/meta/noneSpécifie s'il faut précharger la vidéo, valeurs possibles :
auto - charger lorsque la page est chargé Charger la vidéo entière
méta - charger les métadonnées uniquement lorsque la page se charge
aucune - ne pas charger la vidéo lorsque la page se charge
* src Adresse vidéo L'URL de la vidéo à lire Il est recommandé d'utiliser une adresse absolue.
largeurValeur du pixel Définit la largeur du lecteur vidéo.


如何写兼容的视频标签?

由于旧的浏览器和Internet Explorer不支持

复制代码

代码如下:

<video width="320" height="240" controls> 
<!-- 兼容 Firefox --> 
<source src="http://www.jb51.net/ movie.ogg" type="video/ogg" /> 
<!-- 兼容 Safari/Chrome--> 
<source src="http://www.jb51.net/ movie.mp4" type="video/mp4" /> 
<!-- 如果浏览器不支持video标签,则使用flash --> 
<embed src="http://www.jb51.net/ movie.swf" type="application/x-shockwave-flash" 
width="320" height="240" allowscriptaccess="always" allowfullscreen="true"></embed> 
</video>
Copier après la connexion

相关推荐:

H5的video如何实现以及操作弹幕

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers numéros
validation html5 pour symfony 2.1
Depuis 1970-01-01 08:00:00
0
0
0
La différence entre HTML et HTML5
Depuis 1970-01-01 08:00:00
0
0
0
html5 afficher masquer
Depuis 1970-01-01 08:00:00
0
0
0
Concernant l'utilisation de html5
Depuis 1970-01-01 08:00:00
0
0
0
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal