萬盛學電腦網

您现在的位置: 萬盛學電腦網 >> 軟體知識 >  >> 熱門軟體

Dreamweaver CS6 設置網頁背景音樂教程:BGSound 標籤與媒體插件雙方案詳解

Dreamweaver CS6 為網頁添加背景音樂有兩種主流方案:<bgsound> 標籤(僅 IE 支援)與媒體插件 <embed>(跨瀏覽器相容性較好)。本文提供代碼語法、屬性參數、實戰示例與瀏覽器相容性分析。

方案一:<bgsound> 標籤(IE 專用)

語法格式

<bgsound src="音樂文件地址" loop="播放次數" delay="延遲時間" volume="音量" balance="左右聲道平衡">

屬性詳解

屬性 說明 典型值
src 背景音樂文件路徑(相對/絕對) music.mid, bgm.mp3
loop 播放次數,-1 為無限循環 -1, 3, infinite
delay 開始播放前延遲(秒) 5, 10
volume 音量(-10000 到 0) -2000
balance 左右聲道平衡(-10000 到 10000) 0 (置中)

實戰代碼示例

<html>
<head>
  <bgsound src="bgm.mp3" loop="-1" volume="-1500">
</head>
<body>
  <!-- 頁面內容 -->
</body>
</html>

⚠️ 缺陷

  • 僅 Internet Explorer 支援,Chrome/Firefox/Safari/Edge 忽略此標籤
  • 音樂文件應盡量小(建議 < 500KB),否則影響頁面載入速度
  • 現代網頁設計不推薦自動播放背景音樂(用戶體驗差、無障礙問題)

方案二:媒體插件 <embed>(跨瀏覽器)

語法格式

<embed src="音樂地址" autostart="true/false" loop="true/false" 
       controls="控制面板類型" width="寬" height="高">

controls 屬性值對照表

實戰示例(顯示播放控制條)

<embed src="bgm.mp3" autostart="true" loop="true" 
       controls="console" width="300" height="45">

現代最佳實踐建議

  • 使用 HTML5 <audio> 標籤(原生、無插件、全瀏覽器支援)
  • 提供用戶可見播放控制項,預設不自動播放
  • 提供靜音/暫停按鈕,尊重用戶選擇
  • 考慮版權問題,優先使用免版權/自製音樂

HTML5 Audio 範例

<audio controls loop preload="metadata">
  <source src="bgm.mp3" type="audio/mpeg">
  <source src="bgm.ogg" type="audio/ogg">
  您的瀏覽器不支援音頻播放。
</audio>

相關教程:

copyright © 萬盛學電腦網 all rights reserved