ホームページ >ウェブフロントエンド >フロントエンドQ&A >HTMLに音声を追加する方法
オーディオを HTML に追加する方法: 最初に空の HTML5 ドキュメント構造を作成し、次に body タグに audio 要素を挿入し、ソースを通じてオーディオ ファイルを導入し、最後に作成されたページ プログラムを実行します。
この記事の動作環境: Windows7 システム、HTML5&&CSS3 バージョン、Dell G3 コンピューター。
Sublime Text ツールを開き、下図に示すように、挿入する音声ファイルと HTML ファイルが含まれるディレクトリ構造を準備します。
HTML ファイルを開き、次の図に示すように、新しい空の HTML5 ドキュメント構造を作成します。エンコードは UTF-8 に設定する必要があることに注意してください。
次に、body タグに audio 要素を挿入します。次の図に示すように、audio 要素はソースを通じてオーディオ ファイルを紹介します。ファイル タイプは次のとおりである必要があることに注意してください。正しく書かれています。
作成したページ プログラムを実行すると、Web ページに以下のようなオーディオ プレーヤーが表示され、再生ボタンをクリックすると、オーディオが自動的に再生されます。
もちろん、audio 要素をサポートしていない古いバージョンのブラウザがたくさんありますが、現時点では、ブラウザがサポートしていない場合に音声にプロンプトを追加できます。 audio 要素をサポートすると、このプロンプトが表示されます。
再生ページに入った直後にオーディオ コンテンツを自動的に再生したい場合は、次の図に示すように、オーディオにcontrols属性を追加する必要があります。
最後に、編集者は、現在の主流ブラウザによる HTML5 の audio 要素のサポートをリストしました。これは参考として使用できます。
推奨学習: 「HTML5 ビデオ チュートリアル 」
以上がHTMLに音声を追加する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。