Inhaltsverzeichnis
OGG
JA
Oper
WAV
Steuerelemente:

HTML-Audio-Tag

Sep 04, 2024 pm 04:33 PM
html html5 HTML Tutorial HTML Properties HTML tags

HTML-Audio-Tag eingeführt in HTML 5. Dieses Tag wird verwendet, um alle Audiodateien zur HTML-Seite hinzuzufügen. Dieses Audio-Tag fügt auch Audio-Steuerelemente wie Wiedergabe, Lautstärke, Pause usw. hinzu. Im Audio-Tag Das Element wird verwendet, um alternative Audiodateien auszuwählen, die der Browser auswählt. Der Browser wählt immer das erste erkannte Format. Wir können auch Text zwischen Tag, aber es führt keine Audiofunktion aus; es fungiert lediglich als einfacher Text.

Browser und zulässige Formate:

Browsers Formats
  MP3 WAV OGG
Edge/IE YES NO NO
Chrome YES YES YES
Firefox YES YES YES
Safari YES YES NO
Opera YES YES YES
Browser

Formate

 

MP3 WAV
File Format Media Type
MP3 audio/mpeg
OGG audio/ogg
WAV audio/wav

OGG

Edge/IE

    JA
NEIN NEIN
  • Chrom JA
  • JA JA
  • Firefox JA
  • JA JA
  • Safari JA

    JA

    NEIN

    Oper

    JA

    JA
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="ISO-8859-1">
    <title>Audio Tag</title>
    <style type="text/css">
    h1
    {
    color: red;
    text-align: center;
    }
    p
    {
    color: green;
    font-size: 20px;
    border: 2px dotted brown;
    }
    </style>
    </head>
    <body>
    <h1>Audio Tag Introduction</h1>
    <p>HTML audio tag introduced in HTML 5. This tag is used to add all
    audio files to the HTML page. This audio tag also adds audio controls
    like play, volume, pause etc. In audio tag source element is used for
    choose alternative audio files which browser is choosing, browser is
    always choose first recognized format. We can also add text between
    audio and /audio tag but it is not performing audio functionality, it
    is just act as plain text.</p>
    <h1>MP3 Audio Demo from online source</h1>
    <audio controls>
    <source
    src="https://file-examples.com/wp-content/uploads/2017/11/file_example_MP3_700KB.mp3"
    type="audio/mpeg">
    </audio>
    </body>
    </html>
    Nach dem Login kopieren
    JA

    Wie funktioniert das Audio-Tag in HTML? HTML-Audio funktioniert basierend auf der Art der Audiodatei, die wir angegeben haben, und den darin verwendeten Attributen.

    HTML-Audio-Tag

    Audioformate und Medientyp:

    Dateiformat

    Medientyp
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="ISO-8859-1">
    <title>Audio Tag</title>
    <style type="text/css">
    h1
    {
    color: green;
    text-align: center;
    }
    p
    {
    color: blue;
    font-size: 20px;
    border: 2px solid orange;
    }
    </style>
    </head>
    <body>
    <h1>Audio Tag Introduction</h1>
    <p>HTML audio tag introduced in HTML 5. This tag is used to add all
    audio files to the HTML page. This audio tag also adds audio controls
    like play, volume, pause etc. In audio tag source element is used for
    choose alternative audio files which browser is choosing, browser is
    always choose first recognized format. We can also add text between
    audio and /audio tag but it is not performing audio functionality, it
    is just act as plain text.</p>
    <h1>WAV Audio Demo from online source</h1>
    <audio controls>
    <source
    src="https://file-examples.com/wp-content/uploads/2017/11/file_example_WAV_1MG.wav"
    type="audio/wav">
    </audio>
    </body>
    </html>
    Nach dem Login kopieren
    MP3

    Audio/mpeg OGG

    HTML-Audio-Tagaudio/ogg

    WAV

    Audio/WAV

    Attribute
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="ISO-8859-1">
    <title>Audio Tag</title>
    <style type="text/css">
    h1
    {
    color: blue;
    text-align: center;
    }
    p
    {
    color: fuchsia;
    font-size: 20px;
    border: 2px dashed red;
    }
    </style>
    </head>
    <body>
    <h1>Audio Tag Introduction</h1>
    <p>HTML audio tag introduced in HTML 5. This tag is used to add all
    audio files to the HTML page. This audio tag also adds audio controls
    like play, volume, pause etc. In audio tag source element is used for
    choose alternative audio files which browser is choosing, browser is
    always choose first recognized format. We can also add text between
    audio and /audio tag but it is not performing audio functionality, it
    is just act as plain text.</p>
    <h1>OGG Audio Demo from online source</h1>
    <audio controls autoplay>
    <source
    src="https://file-examples.com/wp-content/uploads/2017/11/file_example_OOG_5MG.ogg"
    type="audio/ogg">
    </audio>
    </body>
    </html>
    Nach dem Login kopieren
    Es handelt sich um unterschiedliche Attribute innerhalb des Audio-Tags. Dabei hat jedes Attribut seine eigene auszuführende Funktionalität. Zulässige Attribute in

    Das obige ist der detaillierte Inhalt vonHTML-Audio-Tag. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

  • Erklärung dieser Website
    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

    Heiße KI -Werkzeuge

    Undresser.AI Undress

    Undresser.AI Undress

    KI-gestützte App zum Erstellen realistischer Aktfotos

    AI Clothes Remover

    AI Clothes Remover

    Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

    Undress AI Tool

    Undress AI Tool

    Ausziehbilder kostenlos

    Clothoff.io

    Clothoff.io

    KI-Kleiderentferner

    Video Face Swap

    Video Face Swap

    Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

    Heiße Werkzeuge

    Notepad++7.3.1

    Notepad++7.3.1

    Einfach zu bedienender und kostenloser Code-Editor

    SublimeText3 chinesische Version

    SublimeText3 chinesische Version

    Chinesische Version, sehr einfach zu bedienen

    Senden Sie Studio 13.0.1

    Senden Sie Studio 13.0.1

    Leistungsstarke integrierte PHP-Entwicklungsumgebung

    Dreamweaver CS6

    Dreamweaver CS6

    Visuelle Webentwicklungstools

    SublimeText3 Mac-Version

    SublimeText3 Mac-Version

    Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

    Heiße Themen

    Java-Tutorial
    1653
    14
    PHP-Tutorial
    1251
    29
    C#-Tutorial
    1224
    24
    Tabellenrahmen in HTML Tabellenrahmen in HTML Sep 04, 2024 pm 04:49 PM

    Anleitung zum Tabellenrahmen in HTML. Hier besprechen wir verschiedene Möglichkeiten zum Definieren von Tabellenrändern anhand von Beispielen für den Tabellenrand in HTML.

    Verschachtelte Tabelle in HTML Verschachtelte Tabelle in HTML Sep 04, 2024 pm 04:49 PM

    Dies ist eine Anleitung für verschachtelte Tabellen in HTML. Hier diskutieren wir anhand der entsprechenden Beispiele, wie man eine Tabelle innerhalb der Tabelle erstellt.

    HTML-Rand links HTML-Rand links Sep 04, 2024 pm 04:48 PM

    Anleitung zum HTML-Rand links. Hier besprechen wir einen kurzen Überblick über HTML margin-left und seine Beispiele sowie seine Code-Implementierung.

    HTML-Tabellenlayout HTML-Tabellenlayout Sep 04, 2024 pm 04:54 PM

    Leitfaden zum HTML-Tabellenlayout. Hier besprechen wir die Werte des HTML-Tabellenlayouts zusammen mit den Beispielen und Ausgaben im Detail.

    HTML-Eingabeplatzhalter HTML-Eingabeplatzhalter Sep 04, 2024 pm 04:54 PM

    Leitfaden für HTML-Eingabeplatzhalter. Hier besprechen wir die Beispiele für HTML-Eingabeplatzhalter zusammen mit den Codes und Ausgaben.

    HTML-geordnete Liste HTML-geordnete Liste Sep 04, 2024 pm 04:43 PM

    Leitfaden zur HTML-geordneten Liste. Hier besprechen wir auch die Einführung von HTML-geordneten Listen und Typen sowie deren Beispiele

    HTML-Onclick-Button HTML-Onclick-Button Sep 04, 2024 pm 04:49 PM

    Anleitung zum HTML-OnClick-Button. Hier diskutieren wir deren Einführung, Funktionsweise, Beispiele und Onclick-Events in verschiedenen Veranstaltungen.

    Text in HTML verschieben Text in HTML verschieben Sep 04, 2024 pm 04:45 PM

    Anleitung zum Verschieben von Text in HTML. Hier besprechen wir eine Einführung, wie Marquee-Tags funktionieren, mit Syntax und Beispielen für die Implementierung.

    See all articles