如何删除 HTML5 音频标签中的下载选项？

Question

I am using the HTML5 audio tag on a website I'm maintaining. I noticed that the audio tag has a download icon embedded in it. How do I remove that option? I want the audio to be read (playback) only. Is there a way to do this without JavaScript or jQuery? I don't know either one yet.

Answer 1

To remove the download option from the UI add controlsList="nodownload" attribute

        <audio
           controls
           controlsList="nodownload">

        </audio>

Answer 2

There is nothing on the audio element interface that controls only the download button. There is the controls attribute, which is a Boolean attribute, just shows or hides all of the controls on the audio UI.

Answer 3

Try this might it help you. It is not the best way but I think it will solve your problem.

audio::-webkit-media-controls-enclosure {
    overflow:hidden;
}

audio::-webkit-media-controls-panel {
    width: calc(100% + 30px); /* Adjust as needed */
}