Is it possible to style HTML5 audio tag?

HTMLWeb DevelopmentFront End Technology

HTML 5 audio tags can be styled. By using the audio tag with “controls” attribute, the default browsers player is used. You can customize by not using the browsers controls. 

By removing the controls attribute, you can hide the built in browser user’s interface −

<audioid = "player" src = "kalimba.mp3"></audio>
<div>
   <buttononclick = "document.getElementById('player').play()">Play</button>
   <buttononclick = "document.getElementById('player').pause()">Pause</button>
   <buttononclick = "document.getElementById('player').volume += 0.2">Vol+</button>
   <buttononclick = "document.getElementById('player').volume -= 0.2">Vol-</button>
</div>

You can also add CSS classes to each one of the elements and style them accordingly.

raja
Published on 20-Mar-2018 15:17:05
Advertisements