如何向 HTML5 中的音訊新增控制元件？

HTML5 是一系列技術，使用者可以使用它們來建立更強大、更多樣性的網站和 Web 應用程式，這些網站和 Web 應用程式支援多媒體，並能夠與軟體介面進行通訊，等等。在本文中，我們將瞭解如何向 HTML5 中的音訊新增控制元件。

語法

<audio controls>
   <source>
</audio>

/audio 標籤的 controls 屬性可用於指定嵌入式音訊的控制元件。它允許使用者在網頁中直接嵌入音樂播放器。controls 屬性增加了播放、暫停和音量等功能。

方法

我們準備使用上述的 controls 屬性來為音訊新增控制元件。

範例

步驟 1 − 首先，我們將定義 HTML 程式碼。

<!DOCTYPE html>
<html>
<head>
   <title>How to add controls to an audio in HTML5?</title>
</head>
<body>
   <h4>How to add controls to an audio in HTML5?</h4>
</body>
</html>

步驟 2 − 現在，我們將新增 audio 標籤。

<div>
   <audio controls>
      <source src="audio.wav">
   </audio>
</div>

下面是完整的程式碼 −

<!DOCTYPE html>
<html>
<head>
   <title>How to add controls to an audio in HTML5?</title>
</head>
<body>
   <h4>How to add controls to an audio in HTML5?</h4>
   <div>
      <audio controls>
         <source src="audio.wav">
      </audio>
   </div>
</body>
</html>

結論

在本文中，我們對 /audio 標籤的 controls 屬性有了清晰的瞭解。我們瞭解到，透過使用 controls 屬性，可以在 HTML5 中的網頁中為音訊新增控制元件。

更新於： 2023 年 3 月 30 日

479 次瀏覽

開啟您的 職業生涯

完成課程認證

立即開始
廣告