Как встраивать аудио в HTML
<audio controls>
<source src="name.mp3" type="audio/mp3" />
</audio>
Famous Fly
<audio controls>
<source src="name.mp3" type="audio/mp3" />
</audio> <audio controls>
<source src="sound.ogg" type="audio/ogg">
<source src="sound.mp3" type="audio/mpeg">
No audio support.
</audio>
<audio src="sound.mp3" autoplay></audio>
<figure>
<figcaption>Listen to the T-Rex:</figcaption>
<audio
controls
src="/media/cc0-audio/t-rex-roar.mp3">
Your browser does not support the
<code>audio</code> element.
</audio>
</figure>
Custom styling for <audio>
Ref: https://stackoverflow.com/questions/4126708/is-it-possible-to-style-html5-audio-tag
audio::-webkit-media-controls-panel {}
audio::-webkit-media-controls-mute-button {}
audio::-webkit-media-controls-play-button {}
audio::-webkit-media-controls-timeline-container {}
audio::-webkit-media-controls-current-time-display {}
audio::-webkit-media-controls-time-remaining-display {}
audio::-webkit-media-controls-timeline {}
audio::-webkit-media-controls-volume-slider-container {}
audio::-webkit-media-controls-volume-slider {}
audio::-webkit-media-controls-seek-back-button {}
audio::-webkit-media-controls-seek-forward-button {}
audio::-webkit-media-controls-fullscreen-button {}
audio::-webkit-media-controls-rewind-button {}
audio::-webkit-media-controls-return-to-realtime-button {}
audio::-webkit-media-controls-toggle-closed-captions-button {}<audio controls>
<source src="sound.ogg" type="audio/ogg"/>
<source src="sound.mp3" type="audio/mpeg"/>
</audio>
this will also work in react js & html