HTMLのメディアの可能性は、HTML5にビデオとオーディオ要素の導(dǎo)入とともに離陸しました。これで、FlashやSilverlightなどの獨(dú)自のテクノロジーを必要とせずに、Webサイトにビデオとオーディオを埋め込むことができます。

ブラウザのサポートをこれまで以上にサポートし、WebVTTのような新しいテクノロジーが到著し始めていることは、これらの新しいHTML要素を知る（または再検討する）絶好の機(jī)會(huì)です。

SitePointは、HTML5メディア要素でスピードを上げるコースであり、CSSとJavaScriptで次のレベルに進(jìn)む方法を作成しました。

コースのビデオがボールを転がすビデオで、カスタムメディアプレーヤーのHTMLコードを構(gòu)築する方法を示しています。 （後のビデオでは、CSSとJavaScriptでこれに基づいて構(gòu)築する方法を示して、完全に機(jī)能するカスタムメディアプレーヤーを作成します。） プレーヤーをロードする…

このデモのソースファイルをGitHubでダウンロードできます。

これが便利であることがわかった場(chǎng)合は、SitePointのフルコースをチェックしてください。これにより、基本から完全に機(jī)能するカスタムメディアプレーヤーの開(kāi)発、オーディオとビデオの両方をプレイします。 HTMLでメディアプレーヤーの構(gòu)築に関するよくある質(zhì)問(wèn)（FAQ）メディアプレーヤーを作成するために必要な基本的なHTMLタグは何ですか？

htmlでメディアプレーヤーを作成するには、

またはタグを使用する必要があります。これらのタグは、Webページにビデオまたはオーディオコンテンツを埋め込むために使用されます。

タグは、メディアのソースファイルを指定するためにこれらのタグ內(nèi)で使用されます。 「コントロール」屬性を

またはタグに追加して、プレイ、一時(shí)停止、およびボリュームコントロールを提供できます。レスポンシブ？

メディアプレーヤーをレスポンシブにするには、CSSを使用できます。ビデオの幅を100％に、高さを自動(dòng)に設(shè)定することにより、ビデオプレーヤーはコンテナのサイズに応じてスケーリングします。これにより、メディアプレーヤーがさまざまな畫(huà)面のサイズとオリエンテーションに適応することが保証されます。

メディアプレーヤーに字幕またはキャプションを追加するにはどうすればよいですか？タグ。このタグは

タグ內(nèi)で使用され、「種類」、「SRC」、および「Srclang」屬性が必要です。 「種類」屬性は、テキストトラックのタイプを指定し、「SRC」屬性はテキストトラックのソースファイルを指定し、「srclang」屬性はテキストトラックの言語(yǔ)を指定します。

メディアプレーヤーのコントロールをカスタマイズするにはどうすればよいですか？

メディアプレーヤーのコントロールをカスタマイズするには、JavaScriptとCSSが必要です。 「コントロール」屬性を

さまざまなブラウザとの互換性を確保するために、メディアプレーヤーをさまざまなブラウザと互換性のあるものにするにはどうすればよいですか。さまざまな形式のソースファイル。ブラウザは、サポートする最初のソースファイルを使用します。これは、

またはタグ內(nèi)の複數(shù)の

タグを使用して行うことができます。 タグの「ポスター」屬性を使用して、メディアプレーヤーにポスター畫(huà)像を追加します。 「ポスター」屬性は、ビデオのダウンロード中に表示される畫(huà)像を指定します。ユーザーが再生ボタンにヒットするまで指定します。 >またはタグの「プリロード」屬性を使用しています。 「Preload」屬性は、ページが読み込まれたときにオーディオ/ビデオをロードする必要があるかどうか、および著者がどのように考えるかを指定します。 「自動(dòng)」、「メタデータ」、「なし」の3つの値があります。 >フルスクリーンでビデオまたはオーディオを再生するには、JavaScript APIであるフルスクリーンAPIが必要です。 「requestfullscreen」メソッドを使用して、ビデオまたはオーディオ要素をフルスクリーンにすることができます。この方法は、クリックイベントなどのユーザーアクションの結(jié)果として実行する必要があります。

以上がHTMLでメディアプレーヤーを構(gòu)築しますの詳細(xì)內(nèi)容です。詳細(xì)については、PHP 中國(guó)語(yǔ) Web サイトの他の関連記事を參照してください。