没有音量滑块或静音按钮的音频标签？

Question

我创建了一个没有带

下载按钮的音频标签

<audio controls controlslist="nodownload">

这很成功。

现在，如何删除播放声音时出现的音量滑块（加上静音按钮）？

我试过

<audio controls controlslist="novolume">

没有任何运气。

Answer 1

尝试一下：

audio::-webkit-media-controls-mute-button {
    display: none !important;
}

audio::-webkit-media-controls-volume-slider {
    display: none !important;
}

Answer 2

HTML5 standard中的新controlslist属性只能接受三种设置：

"nodownload", "nofullscreen" and "noremoteplayback".

除此之外，没有任何可以控制特定控件。唯一（当前）的解决方法是为音频对象构建自己的自定义界面，并仅提供您希望用户通过UI访问的控件。

该属性目前仅在Chrome和Opera以及Android中受支持。这当然是为音频构建自定义UI的另一个动机（或使用Johannes建议的库）。

Answer 3

对于HTML5 audio标记，只有controls或者没有，并且每个浏览器都会以不同的方式显示它。但是没有办法只显示一些控件。

要实现这一点，您必须使用像jPlayer（http://jplayer.org/）这样的javascript / jQuery播放器，它允许完整的个人配置UI（但仍然在后台使用HTML5）