」のコードを追加するだけで音楽を追加できます。 embed タグはさまざまなマルチメディアを挿入するために使用でき、形式は Midi、Wav、AIFF、AU、MP3 などです。"/> 」のコードを追加するだけで音楽を追加できます。 embed タグはさまざまなマルチメディアを挿入するために使用でき、形式は Midi、Wav、AIFF、AU、MP3 などです。">
ホームページ > 記事 > ウェブフロントエンド > HTMLに音楽mp3を追加する方法
HTMLではembedタグを使用して、本文部分に「0290e1cea1cca5be41390ffd2d1fdaed」というコードを追加するだけで音楽を追加できます。 embed タグはさまざまなマルチメディアを挿入するために使用でき、形式は Midi、Wav、AIFF、AU、MP3 などです。
このチュートリアルの動作環境: Windows 7 システム、CSS3&HTML5 バージョン、Dell G3 コンピューター。
embed タグを使用して音楽を追加できます。d8e2720730be5ddc9c2a3782839e8eb6 タグは、プラグインなどの埋め込みコンテンツを定義します。
文法:
embed src=url
説明: embed を使用してさまざまなマルチメディアを挿入できます。形式は Midi、Wav、AIFF、AU、MP3 などにすることができます。Netscape と新しいバージョンの IE がサポートされています。それ。 URL はオーディオ ファイルまたはビデオ ファイルとそのパスであり、相対パスまたは絶対パスを使用できます。
例:
コードは次のとおりです:
<embed src="your.mid">
2. 属性設定
1. 自動再生:
構文: autostart =true 、 false
説明: この属性は、ダウンロード後にオーディオ ファイルまたはビデオ ファイルを自動的に再生するかどうかを指定します。
true: 音楽ファイルはダウンロード後に自動的に再生されます;
false: 音楽ファイルはダウンロード後に自動的に再生されません。
例:
コードは次のとおりです:
<embed src="your.mid" autostart=true> <embed src="your.mid" autostart=false>
2. ループ再生:
構文:loop=positive integer 、true、false
説明: この属性は、オーディオ ファイルまたはビデオ ファイルをループするかどうか、およびループの数を指定します。
属性値が正の整数値の場合、オーディオ ファイルまたはビデオ ファイルのループ数は正の整数値と同じになります。
属性値が true の場合、オーディオ ファイルまたはビデオ ファイルのループ数は正の整数値と同じになります。またはビデオ ファイルのループ;
属性値が false の場合、オーディオ ファイルまたはビデオ ファイルはループしません。
例:
コードは次のとおりです:
<embed src="your.mid" autostart=true loop=2> <embed src="your.mid" autostart=true loop=true> <embed src="your.mid" autostart=true loop=false>
3. パネル表示:
構文: hidden=ture, no
説明: この属性は、コントロール パネルを表示するかどうかを指定します。デフォルト値は no です。
いいえ: パネルを非表示にします;
いいえ: パネルを表示します。
例:
コードは次のとおりです:
<embed src="your.mid" hidden=ture> <embed src="your.mid" hidden=no>
4. 開始時刻:
構文: starttime=mm: ss (分: 秒)
説明: この属性は、オーディオまたはビデオ ファイルの再生を開始する時間を指定します。定義されていない場合は、ファイルの先頭から再生します。
例:
コードは次のとおりです:
<embed src="your.mid" starttime="00:10">
5. ボリューム サイズ:
構文: volume=0 ~ 100 の整数
説明: この属性は、オーディオ ファイルまたはビデオ ファイルの音量を指定します。定義されていない場合は、システム独自の設定が使用されます。
例:
コードは次のとおりです:
<embed src="your.mid" volume="10">
6. コンテナ属性:
構文: height=# width=
# 説明 : 値は正の整数またはパーセンテージで、単位はピクセルです。このプロパティは、コントロール パネルの高さと幅を指定します。
height:控制面板的高度; width:控制面板的宽度。
例:
コードは次のとおりです:
<embed src="your.mid" height=200 width=200>
7. コンテナ単位:
構文: 単位=ピクセル、en
説明 : この属性は、高さと幅の単位をピクセルまたは en として指定します。
例:
コードは次のとおりです:
<embed src="your.mid" units="pixels" height=200 width=200> <embed src="your.mid" units="en" height=200 width=200>
8. 外観設定:
構文:controls=console、smallconsole、playbutton、pausebutton、停止ボタン、ボリュームレバー 説明: このプロパティは、コントロール パネルの外観を指定します。デフォルト値はコンソールです。
コンソール: 通常のパネル;
smallconsole: 小さいパネル;
再生ボタン:再生ボタンのみ表示;
一時停止ボタン: 一時停止ボタンのみ表示;
停止ボタン: 停止ボタンのみ表示;
音量レバー: 音量調整ボタンのみが表示されます。
例:
コードは次のとおりです:
<embed src="your.mid" controls=smallconsole> <embed src="your.mid" controls=volumelever>
9. 説明テキスト:
構文: title =
# 説明: # は説明のテキストです。この属性は、オーディオまたはビデオ ファイルの説明テキストを指定します。
例:
コードは次のとおりです:
<embed src="your.mid" title="第一首歌">
詳細情報:
WebM アドボカシー
AVC (H.264) の認証の問題により、Chrome、Firefox、Opera が主導するオープン ソース キャンプは AVC のサポートに迷い始めました。これらのブラウザは引き続き AVC をサポートできますが、オープンなブラウザも好みます。 WebM プロジェクトと呼ばれるソース マルチメディアには、VP8 と呼ばれる新しいオープン ソース ビデオ コーデック スキームが含まれています。現在、VP8 は VP9 に発展しています。カプセル化された形式としての WebM には、.webm 接尾辞と video/webm MIME タイプが付いています。オーディオの場合は、Vorbis/Opus を使用できます。互換性の観点から見ると、Chrome、Firefox、Opera は VP8 との互換性が非常に高いですが、Safari と IE はほとんどサポートできません。
オープン ソースの Ogg
Ogg は WebM とほぼ同じオープン ソースであり、オープン ソース プラットフォームで広くサポートされています。そのビデオ エンコード スキームは Theora (Xiph.org Foundation によって開発された VP3 から開発され、任意のパッケージ形式で使用できます) と呼ばれ、オーディオは Vorbis です。通常、サフィックスは .ogv または .ogg で、MIME タイプは video/ogg です。互換性の点では、Chrome、Firefox、Opera はサポートできますが (ただし、Opera はモバイル プラットフォームではサポートできません)、Safari と IE はほとんどサポートできません。
Html5方案
以上的讨论实际上的大前提是:视频基于Html5的39000f942b2545a5315c57fa3276f220方案。现在我们来总结一下兼容性:
Codecs/container |
IE |
Firefox |
Safari |
Chrome |
Opera |
iPhone |
Android |
Theora+Vorbis+Ogg |
· |
3.5+ |
|
5.0+ |
10.5+ |
· |
· |
H.264+AAC+MP4 |
9.0+ |
· |
3.0+ |
5.0+‡ |
· |
3.0+ |
2.0+ |
WebM |
9.0+* |
4.0+ |
|
6.0+ |
10.6+ |
· |
2.3+ |
* IE9 “只有当用户安装了VP8的编解码器时”才能支持VP8。 | |||||||
‡ Google Chrome 2011年宣布 放弃H.264, 但是“还没兑现”。 |
可以看出现在主流的仍然是MP4(AVC),但是为了解决“开源阵营”对AVC的摇摆不定,可以选择利用video的多源方案,在AVC的基础上额外提供对webm或ogg的支持:
<video poster="movie.jpg" controls> <source src="movie.webm" type='video/webm; codecs="vp8.0, vorbis"'> <source src="movie.ogg" type='video/ogg; codecs="theora, vorbis"'> <source src="movie.mp4" type='video/mp4; codecs="avc1.4D401E, mp4a.40.2"'> <p>This is fallback content</p> </video>
浏览器会根据自己的偏好来选择具体加载那种格式的流媒体文件,当然服务端必须对同一个视频提供多种格式的支持,具体可以这么做:
提供一个WebM的视频版本(VP8+Vorbis)
提供一个MP4的视频版本(H.264+AAC(low complexity))
提供Ogg版本(Theora+Vorbis)
服务端推荐使用nginx,尽量注意MIME类型的配置正确
推荐学习:html视频教程
以上がHTMLに音楽mp3を追加する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。