Maison  >  Article  >  interface Web  >  Comment utiliser la balise source html5 ? Introduction aux attributs des balises sources HTML5

Comment utiliser la balise source html5 ? Introduction aux attributs des balises sources HTML5

寻∝梦
寻∝梦original
2018-08-17 17:34:067502parcourir

Comment utiliser la balise source html5 ? Introduction aux attributs des balises sources HTML5. Présentons maintenant le contenu de cet article. Je vais principalement vous parler de l'utilisation des balises source html5 et d'une introduction détaillée aux trois attributs des balises source html5

Définition et utilisation des balises source html5 : La balise

définit les ressources multimédias pour les éléments multimédias (tels que

vous permet de spécifier des fichiers vidéo/audio alternatifs que le navigateur peut sélectionner en fonction de son type de média ou de sa prise en charge du codec.

Exemple de balise HTML5 :

Lecteur audio avec deux fichiers sources. Le navigateur doit sélectionner les fichiers qu'il prend en charge (le cas échéant) :

<audio controls>
   <source src="horse.ogg" type="audio/ogg">
   <source src="horse.mp3" type="audio/mpeg">
 Your browser does not support the audio element.
</audio>

attribut de base de la balise :

  • media : Le type de ressource multimédia permettant au navigateur de décider s'il doit télécharger (valeur : media_query).

  • src : URL du fichier média (valeur : URL).

  • type : type MIME de la ressource multimédia (valeur : MIME_type).

Remarque : La balise prend en charge les attributs globaux HTML et les attributs d'événement HTML

Format de balise source HTML5 :

<source src="媒体资源地址" />

Attribut média HTML5 :

Utiliser l'attribut média :

<source src="movie.ogg" type="video/ogg" media="screen and (min-width:320px)">

Définition et utilisation de l'attribut média HTML5 :

L'attribut media spécifie le type de ressource multimédia (pour quel média/appareil le fichier est optimisé).

Le navigateur peut utiliser cet attribut pour déterminer s'il peut lire le fichier. Si vous ne pouvez pas y jouer, vous pouvez choisir de ne pas le télécharger.

Remarque : Cette propriété peut accepter plusieurs valeurs.

Syntaxe de l'attribut HTML5media :

<source media="value">

Remarque : étant donné qu'aucun navigateur ne prend en charge l'attribut média de la balise Je n’en dirai donc pas beaucoup plus.

Attribut HTML5src :

Définition et utilisation de l'attribut HTML5src :

attribut src Spécifie l'URL du fichier multimédia à lire.

Syntaxe de l'attribut HTML5src :

<source src="URL">

Exemple d'utilisation de l'attribut HTML5src :

Lecteur audio avec deux fichiers de ressources. Le navigateur doit choisir le fichier qu'il prend en charge (le cas échéant) :

<audio controls>
   <source src="horse.ogg" type="audio/ogg">
   <source src="horse.mp3" type="audio/mpeg">
 Your browser does not support the audio element.
</audio>

Valeur de l'attribut HTML5src :

Comment utiliser la balise source html5 ? Introduction aux attributs des balises sources HTML5

HTML5attribut type :

HTML5La définition et l'utilisation de l'attribut type :

attribut type Spécifie l'attribut Type MIME de la ressource multimédia.

Utilisation de l'attribut type :

<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
您的浏览器不支持 audio 元素。
</audio>

HTML5 Syntaxe de l'attribut type :

<source type="MIME_type">

HTML5 Valeur de l'attribut ;type :

Comment utiliser la balise source html5 ? Introduction aux attributs des balises sources HTML5

Différences entre HTML 4.01 et HTML 5

Prise en charge des navigateurs :

Internet Explorer 9+, Firefox, Opera, Chrome et Safari prennent en charge la balise

Remarque : Internet Explorer 8 et versions antérieures ne prennent pas en charge la balise

[Recommandations associées]

Quel est le rôle de la balise méta html ? Introduction aux attributs communs des balises méta html

Qu'est-ce que la balise html map ? Explication détaillée de la structure et de l'utilisation spécifique de la balise html map

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!

Déclaration:
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