ホームページ > ウェブフロントエンド > フロントエンドQ&A > HTML5で音楽を再生するために使用されるタグは何ですか

HTML5で音楽を再生するために使用されるタグは何ですか

青灯夜游
リリース: 2021-12-17 15:29:09
オリジナル
3781 人が閲覧しました

html5 音楽を再生するには、「

HTML5で音楽を再生するために使用されるタグは何ですか

このチュートリアルの動作環境: Windows 7 システム、HTML5 バージョン、Dell G3 コンピューター。

html5 音楽を再生するには、「

<audio src="music.mp3"></audio>
ログイン後にコピー

HTML5で音楽を再生するために使用されるタグは何ですか

使い方は非常に簡単で、

このように記述するだけでは、ページには何も表示されず、

    <audio src="music.mp3">
        别试了,是你的浏览器渣渣
    </audio>
ログイン後にコピー

HTML5で音楽を再生するために使用されるタグは何ですか

オーディオ ファイルの制御、進行状況、再生の一時停止、音量などの操作を容易にするために、それに control 属性を追加できます。

    <audio src="m.mp3" controls></audio>
ログイン後にコピー

使用方法は

HTML5で音楽を再生するために使用されるタグは何ですか

(Chrome ブラウザのオーディオ コントロール パネル)

HTML5で音楽を再生するために使用されるタグは何ですか

(Firefox ブラウザのオーディオ コントロール パネル)

HTML5で音楽を再生するために使用されるタグは何ですか

(IE ブラウザのオーディオ コントロール パネル)

どちらがより良く見えるかは意見の問題です~~

タグにも単語タグ があります。

これらは、複数のオーディオを導入するという同じ機能と使用法を持っています。ブラウザは、ロードするサポートされているオーディオ形式を選択します。

    <audio>
        <source src="music.mp3">
        <source src="music.ogg">
        <source src="music.wav">
    </audio>
ログイン後にコピー

注: 主流のオーディオ ファイル形式は、mp3、wav、ogg です。ブラウザーが異なれば、3 つの形式に対するサポートのレベルも異なります。その中で、mp3形式が最もよくサポートされています。

autoplay 属性: 読み込み完了後に自動的に再生します。使い方もとても簡単です。

 <audio src="m.mp3" autoplay></audio>
ログイン後にコピー

ループ属性: 名前のとおり、ループ再生します。

<audio src="m.mp3" loop></audio>
ログイン後にコピー

preload 属性: オーディオがロードされるタイミングを制御するために使用されます。

 <audio src="m.mp3" preload="auto"></audio>
ログイン後にコピー

には 3 つの対応する値があります:

  • none: デフォルトではロードされず、必要に応じて再度ロードされます。

  • metadata: メタデータ。デフォルトではロードされませんが、オーディオのメタデータ情報を抽出できます。

  • auto: 自動読み込み。Web ページが読み込まれた後に音声全体が読み込まれます。

ミュート属性: ミュート効果。

<audio src="m.mp3" muted></audio>
ログイン後にコピー
ミュート属性を追加しました。

オーディオの再生中であっても、ユーザーがコントロール パネルの音量を手動で調整しない限り、音は鳴りません。 関連する推奨事項:「

html ビデオ チュートリアル

以上がHTML5で音楽を再生するために使用されるタグは何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート