"."/> ".">
简体中文（ZH-CN）English（EN）繁体中文（ZH-TW）日本語（JA）한국어（KO）Melayu（MS）Français（FR）Deutsch（DE）
Heim
Artikel
Fragen und Antworten
Kurs
Thema
Herunterladen
Spiel
Wörterbuch
kürzliche Updates

Heim  >  Artikel  >  Web-Frontend  >  So verwenden Sie das Quell-Tag von HTML5

So verwenden Sie das Quell-Tag von HTML5

WBOY
WBOYOriginal
2022-06-01 17:54:192995Durchsuche

In HTML5 wird das Quell-Tag verwendet, um dem Browser verschiedene Arten von Video- oder Audiodateien zur Auswahl bereitzustellen. Die Syntax lautet „“.

So verwenden Sie das Quell-Tag von HTML5

Die Betriebsumgebung dieses Tutorials: Windows 10-System, HTML5-Version, Dell G3-Computer.

html5-Quelltag

definiert Medienressourcen für Medienelemente (wie

-Tag können Sie zwei Video-/Audiodateien angeben, die der Browser basierend auf seinem Medientyp oder seiner Codec-Unterstützung auswählen kann.

Mögliche Attributwerte sind wie folgt:

  • media media_query gibt den Typ der Medienressource an, damit der Browser entscheidet, ob er heruntergeladen werden soll.

  • src URL gibt die URL der Mediendatei an.

  • type MIME_type gibt den MIME-Typ der Medienressource an.

  • Größen Verschiedene Seitenlayouts legen unterschiedliche Bildgrößen fest.

  • srcset URL ist erforderlich, wenn es auf das angewendet wird. Geben Sie Bild-URLs an, die in verschiedenen Situationen verwendet werden sollen.

Beispiel ist wie folgt:

Audioplayer mit zwei Quelldateien. Der Browser muss die Quelldatei auswählen, die er unterstützt (wenn beide unterstützt werden, wählen Sie eine aus): 

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>123</title> 
</head>
<body>
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
您的浏览器不支持 audio 元素。
</audio>
</body>
</html>

Ausgabeergebnisse:

So verwenden Sie das Quell-Tag von HTML5

Empfohlenes Tutorial: „HTML-Video-Tutorial“

Das obige ist der detaillierte Inhalt vonSo verwenden Sie das Quell-Tag von HTML5. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：Was bedeutet die Arc-Funktion in HTML5?Nächster Artikel：Was bedeutet die Arc-Funktion in HTML5?

In Verbindung stehende Artikel

Mehr sehen