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

Question

我创建了一个没有下载按钮的音频标签，

<audio controls controlslist="nodownload">

这是成功的。

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

我试过了

<audio controls controlslist="novolume">

没有任何运气。

Answer 1

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

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

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

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

Answer 2

尝试这个：

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

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