82添加网页特效之“播放音乐”网页案例.docx资源-CSDN文库

版权申诉

86 浏览量 2022-10-26 14:33:40 上传评论收藏 477KB DOCX 举报

【网页特效：播放音乐】网页设计中，增添音乐效果能够极大地提升用户体验，为网页增加感染力，让访客在阅读内容的同时享受听觉盛宴。本案例聚焦于如何在网页中添加音乐，通过学习，你可以掌握如何插入音频文件，并了解不同音频格式的特点。 ### 常见音频格式 1. **Wave Audio Files (WAV)**：由微软开发，声音质量优秀，但文件体积大，不适合网络传输。通常用于短暂的声音特效。 2. **MP3 (MPEG-Audio Layer-3)**：高压缩比，音质良好，1分钟的MP3文件大约只有1MB，是网络上常用的音频格式。 3. **Windows Media Audio (WMA)**：微软开发，压缩比高于MP3，支持流媒体技术，适合在线播放。 4. **Real Media (RM)**：Real Networks公司的产品，压缩比更高，支持流式播放，适用于低带宽环境。 ### 插入音频的方法 #### 1. 使用`<bgsound>`标签 - **适用浏览器**：仅限于IE。 - **步骤**： - 打开网页代码视图。 - 在`<head>`和`</head>`之间插入`<bgsound>`标签。 - 编辑标签，设置音乐源、循环次数、平衡、音量和延迟。 #### 2. 使用`<embed>`标签 - **兼容性**：支持更多浏览器，包括音频、视频和SWF格式。 - **步骤**： - 切换到代码视图。 - 输入`<embed>`标签，编辑标签，设置音乐源、播放器宽高、间距、是否自动开始、是否循环和是否隐藏。 ### `<embed>`标签的参数 - **源**：指定音乐文件路径。 - **宽度**和**高度**：播放器的尺寸。 - **水平间距**和**垂直间距**：与页面元素的间隔。 - **自动开始**：决定页面加载时是否自动播放。 - **循环**：设定音乐是否重复播放。 - **隐藏**：控制播放器是否可见。 ### 相关知识在Dreamweaver中，插入音频元素有多种方式，应根据网页需求和用户偏好选择合适的方法。除了`<bgsound>`和`<embed>`标签，还可以使用HTML5的`<audio>`标签，它提供了更丰富的控制选项和更好的浏览器兼容性。 ```html <audio controls> <source src="music.mp3" type="audio/mpeg">  Your browser does not support the audio element. </audio> ``` 这段代码创建了一个音频播放器，包含了`controls`属性以显示播放控件，`<source>`标签则用于指定不同格式的音频源，以确保在各种浏览器中都能正常播放。总结来说，创建播放音乐的网页特效需要了解不同音频格式的优缺点，并熟练掌握各种插入音频的方法，如`<bgsound>`和`<embed>`标签，以及HTML5的`<audio>`元素。通过这些技巧，你可以为网页增加个性化的音乐体验，提升用户的浏览享受。

资源推荐

资源详情

资源评论