Rumah > hujung hadapan web > html tutorial > Bagaimana anda membenamkan audio dalam html menggunakan & lt; audio & gt; Tag?

Bagaimana anda membenamkan audio dalam html menggunakan & lt; audio & gt; Tag?

Emily Anne Brown
Lepaskan: 2025-03-20 15:54:31
asal
487 orang telah melayarinya

Bagaimana anda membenamkan audio dalam html menggunakan tag ?

Untuk membenamkan audio dalam HTML menggunakan tag , anda perlu menentukan sumber fail audio dalam tag. Sintaks asas tag adalah seperti berikut:

 <code class="html"><audio src="path/to/your/audiofile.mp3" type="audio/mpeg"> Your browser does not support the audio element. </audio></code>
Salin selepas log masuk

Anda juga boleh menyediakan pelbagai sumber untuk memastikan keserasian merentasi pelayar yang berbeza dengan menggunakan tag di dalam tag :

 <code class="html"><audio> <source src="path/to/your/audiofile.mp3" type="audio/mpeg"> <source src="path/to/your/audiofile.ogg" type="audio/ogg"> Your browser does not support the audio element. </source></source></audio></code>
Salin selepas log masuk

Kaedah ini membolehkan penyemak imbas memilih format audio yang disokong pertama.

Apakah format audio yang berbeza yang disokong oleh tag html ?

Tag HTML menyokong pelbagai format audio, bergantung kepada keupayaan penyemak imbas. Format yang paling sering disokong termasuk:

  • MP3 (.mp3) : Disokong secara meluas di kebanyakan pelayar, termasuk Chrome, Firefox, Safari, dan Edge. Jenis MIME untuk MP3 ialah audio/mpeg .
  • Ogg Vorbis (.ogg) : Disokong oleh Firefox, Chrome, dan Opera, tetapi bukan oleh Safari atau Internet Explorer. Jenis MIME untuk Ogg Vorbis adalah audio/ogg .
  • WAV (.wav) : Disokong oleh Chrome, Firefox, dan Safari, tetapi bukan oleh Internet Explorer. Jenis MIME untuk WAV ialah audio/wav .
  • AAC (.m4a) : Disokong oleh Safari dan Chrome, tetapi bukan oleh Firefox atau Internet Explorer. Jenis MIME untuk AAC ialah audio/aac .

Untuk memastikan keserasian yang luas, ia adalah amalan yang baik untuk menawarkan pelbagai sumber dalam tag .

Bagaimanakah anda boleh menambah kawalan ke pemain audio di HTML menggunakan tag ?

Untuk menambah kawalan ke pemain audio dalam HTML menggunakan tag , anda boleh menggunakan atribut controls . Atribut ini membolehkan set kawalan lalai (bermain, jeda, kelantangan, dan mencari) yang disediakan oleh penyemak imbas. Inilah cara anda boleh melakukannya:

 <code class="html"><audio src="path/to/your/audiofile.mp3" type="audio/mpeg" controls> Your browser does not support the audio element. </audio></code>
Salin selepas log masuk

Atribut controls adalah atribut Boolean, yang bermaksud anda hanya perlu memasukkannya ke dalam tag untuk mengaktifkannya. Jika anda ingin menyesuaikan kawalan, anda mungkin perlu menggunakan JavaScript dan CSS untuk membuat antara muka pemain tersuai.

Apakah pilihan sandaran untuk penyemak imbas yang tidak menyokong tag HTML

Untuk penyemak imbas yang tidak menyokong tag HTML , anda boleh memberikan kandungan sandaran dalam tag . Kandungan ini akan dipaparkan jika penyemak imbas tidak mengenali elemen . Berikut adalah contoh cara memasukkan sandaran:

 <code class="html"><audio> <source src="path/to/your/audiofile.mp3" type="audio/mpeg"> <source src="path/to/your/audiofile.ogg" type="audio/ogg"> <p>Your browser does not support the audio element. You can <a href="path/to/your/audiofile.mp3">download the audio file</a> instead.</p> </source></source></audio></code>
Salin selepas log masuk

Dalam contoh ini, pengguna dengan penyemak imbas yang tidak menyokong tag akan melihat mesej dengan pautan untuk memuat turun fail audio. Satu lagi pilihan sandaran adalah untuk membenamkan pemain audio berasaskan flash, walaupun pendekatan ini kurang biasa sekarang disebabkan oleh penurunan penggunaan kilat:

 <code class="html"><audio> <source src="path/to/your/audiofile.mp3" type="audio/mpeg"> <source src="path/to/your/audiofile.ogg" type="audio/ogg"> <object type="application/x-shockwave-flash" data="flashplayer.swf"> <param name="movie" value="flashplayer.swf"> <param name="flashvars" value="audioFile=path/to/your/audiofile.mp3"> <p>Your browser does not support the audio element or Flash. You can <a href="path/to/your/audiofile.mp3">download the audio file</a> instead.</p> </object> </source></source></audio></code>
Salin selepas log masuk

Pendekatan yang komprehensif ini memastikan pengguna dapat mengakses kandungan audio tanpa mengira keupayaan penyemak imbas mereka.

Atas ialah kandungan terperinci Bagaimana anda membenamkan audio dalam html menggunakan & lt; audio & gt; Tag?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan