白色代码:

复制代码

黑色代码:

复制代码

灰色代码:

复制代码

棕色代码:

复制代码

其中:width=100 height=40 中的数字分别表示播放器的宽度和高度,注意:都选择0将隐藏播放器(隐藏时一定要选择自动播放)

autostart="true"中true或1表示自动播放,false或0表示手动播放

loop="true" 中的true或1表示重复播放,false或0表示只播放一次

复制代码

以前经常有人会问我如何在页面中加入播放器?对于一些新手来说,可以在编辑时点击插入播放器而无需用到HTML代码。但是,千篇一律的款式是不是会让人久而生厌呢?其实,要想让你自己的网页变得生动,一款漂亮的,合乎页面整体设计的播放器就显得极其重要了。现在为你推荐一些漂亮的播放器,你只需复制代码放入你的文章里,就可以使用了。

一、几款最常用的播放器

代码如下

复制代码

(EMBED src="歌曲地址" width=300 height=50 type=audio/mpeg loop="-1" autostart="FALSE" volume="0")

代码如下

复制代码

(EMBED style="FILTER: invert()" src="歌曲地址" width=300 height=50 type=audio/mpeg volume="0" autostart="TRUE" loop="true")

代码如下

复制代码

(EMBED style="FILTER: Xray" src=歌曲地址 width=300 height=05 type=audio/mpeg loop="-1" autostart="false" volume="0")

< p>

代码如下

复制代码

(EMBED style="FILTER: GRAY()" src="歌曲地址" width=300 height=45 type=audio/mpeg loop="-1" autostart="true" volume="0")

重要提示:

1 复制时务必将(EMBED。。。)前后的括号()替换成<>。这点非常重要。

2 WIDTH代表播放器宽度,HEIGHT代表高度,后面的数值可依自己喜好进行调整。

3 AUTOSTART="TRUE" 这里TRUE代表自动播放,如果换成FALSE则代表手动播放。

二、装饰美化你的播放器

有了基本的款式后,我们就可以根据自己的想象力,巧用HTML的表格,根据自己的图片素材,装饰美化自己的播放器啦。只要你有足够的创意,调整代码,就可以得到各式各样的播放器。这里抛砖引玉先介绍几款。

首先我们可以为黑色播放器加上一个边缘

(中间绿底的部分为原黑色播放器代码)

复制代码

< align=center>

当然也可以为蓝色播放器加上粉色边缘

(中间粉底部分为原蓝色播放器代码)

代码如下

复制代码

还可以将播放器置于一个单独的表格里,并加上表格的透明特效,播放器上的花纹就是表格的底图。(中间紫底部分的为原蓝色播放器代码)

代码如下:

复制代码

还可以利用动态的GIF背景做成动态播放器

(中间蓝底部分为原来的灰色播放器代码

代码如下:

复制代码

< align=center>

甚至还可以将动态背景只在播放器底部运行

中间棕底字体为原灰色播放器代码

代码如下

复制代码

这么多五彩缤纷的播放器是不是很吸引你呢?只要你肯花心思,你可以用HTML 表格做成两层或三层的播放器来,呈现你自己不同于他人的特色。这是一个崇尚个性的年代,模仿固然能让你找到捷径,但是创造性才是决定你是否能吸引人的关健。言归正传,如果这个贴能让你有所启发,就达到我们的本意了。也希望今后能看到更多独具特色的播放器出现。

html自动播放音乐播放器代码,[界面设计] 关于HTML 音乐播放器代码|音乐播放器网页代码大全(转)...相关推荐

  1. python音乐下载器交互界面设计_用python实现的百度音乐下载器-python-pyqt-改进版...

    之前写过一个用python实现的百度新歌榜.热歌榜下载器的博文,实现了百度新歌.热门歌曲的爬取与下载.但那个采用的是单线程,网络状况一般的情况下,扫描前100首歌的时间大概得到40来秒.而且用Pyqt ...

  2. android 音乐播放器ui界面设计音乐播放器毕业设计。Android studio编译,项目有源码和apk

    使用Android Studio开发一个简易的音乐播放器 界面图: 视频展示: android 音乐播放器ui界面设计音乐播放器毕业设计.Android studio编译 项目下载: android音 ...

  3. python音乐下载器交互界面设计_Python爬虫实战:制作各大音乐平台的聚合的音乐下载器...

    本文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理. 以下文章来源于Python技术,作者 派森酱 转载地址 https://blog ...

  4. Android开发----音乐播放器(界面设计)

    转眼也沦为"大四狗"的行列当中去,本来打算在暑假的时候找一个实习,结果学校临时安排了"暑期实训" 原本计划好的安排全部被打乱了,哎~~~也只能跟着学校的脚步&q ...

  5. Java运用jna、vlcj实现音乐和视频的播放器1-主界面设计

    一.播放器主框架 public class MainFrame {public JFrame frame;public int width = 100;public int height = 350; ...

  6. 视频播放器的界面设计并实现播放器

    类MediaController extends FrameLayout: 属性: TransportController mController:播放的接口 Context  mContext;上下 ...

  7. android音乐播放器主页面设计,Android项目之旅二 简易Mp3播放器页面设计

    上面我们给大家把项目的环境搭建好了,现在我们就打开我们的Eclipse吧,至于android开发环境的搭建,可以在我的博客中找到相关的资源哦,这里就不给大家再重复了,选择File-->new-- ...

  8. QQ播放器更新界面设计

  9. html仿b站页面代码,B站首页界面设计:附详细教程

    文件名大小更新时间 B站首页界面设计:附详细教程\1.png2994402016-12-29 B站首页界面设计:附详细教程\2.png2492252016-12-29 B站首页界面设计:附详细教程\w ...

  10. 一个Web系统OA界面设计和开发

    早在中国IT业方兴未艾之时,计算机应用系统主要以功能实现为主,几乎没有界面设计这个概念.时至今日,随着计算机和网络的不断普及,社会信息化程度日益加深,用户和市场的不断成熟,人们已经不仅仅满足于&quo ...

最新文章

  1. PHP解析JSON数据的源代码
  2. Jenkins 安装与使用--实例
  3. .NET程序崩溃了怎么抓 Dump ? 我总结了三种方案
  4. [渝粤教育] 中国地质大学 结构力学 复习题
  5. C# char[]与string之间的相互转换
  6. 基于mysql搭建框架环境搭建_Maven+Spring+Spring MVC+MyBatis+MySQL,搭建SSM框架环境
  7. 丁丁打折网卷能用吗_超市货架上就能买到的好用护发素,平价好用,打折时可以多囤点...
  8. LeetCode每日一题:14.longest-common-prefix(最长公共前缀)
  9. 【leetcode】1053. Previous Permutation With One Swap
  10. 高级python_高级Python功能
  11. 【OpenCV学习笔记】【函数学习】十七(imread()函数)
  12. Delphi第三方控件大比拼(收费篇)
  13. PCR概述及前沿技术
  14. 金仓数据库-java连接金仓数据库方法笔记
  15. 使用STK卫星轨道无法显示——解决方法
  16. 《霍乱时期的爱情》摘要
  17. 新人主播直播人气热度底,往往是忽略了这几点。
  18. oracle 2018 拉里,Oracle拉里,有新武器对付SAP和HANA
  19. python基础知识集(三)
  20. java监听器(Listener)统计在线人数

热门文章

  1. Adblock Plus官网最新下载 中文,绿色版Adblock Plus下载谷歌插件,edge,电脑版exe,火狐版,搜狗浏览器,ie浏览器
  2. Hi3519A 接入 BT1120或BT656视频
  3. adb网络连接调试,重启之后失效
  4. pad 迅雷 bt php_iOS永久版迅雷来了 BT、磁力链下载最全教程收好
  5. html视频透明背景怎么设置,微信透明背景图怎么设置 微信透明动态背景图设置方法...
  6. 《Redis开发与运维》----- 客户端
  7. 沙盘推演具体包括哪些内容
  8. bp神经网络预测模型python_BP神经网络模型:Python
  9. 十三肝了2晚的《IDEA操作手册-终极秘籍》终于来了...
  10. 三星c7000 android8,三星C7000官方固件rom刷机包-C7000ZCU3CRI1 安卓8.0