Attribute of
<audio>
What does <audio controls> do?
Toggles the display of audio playback controls.

Code Example

<h3>With Controls </h3>
<audio controls id="audio-example-controls" class="audio-example">
  <!-- One or more source files, each referencing the same audio but in a different file format.
    The browser will choose the first file which it is able to play. -->
   <source src="/wp-content/uploads/flamingos.ogg">
   <source src="/wp-content/uploads/flamingos.mp3">

    You will see this text if native audio playback is not supported.
    <!-- You could use this fall-back feature to insert a JavaScript-based audio player. -->
</audio>

<small>Audio by  <a href="https://soundcloud.com/beeldengeluid">Beeld en Geluid</a> [<a href="http://creativecommons.org/licenses/by-sa/3.0">CC BY-SA 3.0</a>], <a href="https://commons.wikimedia.org/wiki/File%3AArtis%2C_enkele_flamingo&#039;s_-_SoundCloud_-_Beeld_en_Geluid.ogg">via Wikimedia Commons</a></small>

<h3>Without Controls </h3>
<audio id="audio-example-no-controls" class="audio-example" src="/wp-content/uploads/flamenco.mp3">

    You will see this text if native audio playback is not supported.
    <!-- You could use this fall-back feature to insert a JavaScript-based audio player. -->
</audio>

<small>Audio by JCZA [<a href="http://creativecommons.org/licenses/by-sa/3.0">CC BY-SA 3.0</a>] , via <a href="https://commons.wikimedia.org/wiki/File:JCZA_-_JCzarnecki-Flamenco.ogg">Wikimedia Commons</a></small>



<style>
.audio-example {
display: block;
}
</style>

With Controls

Audio by Beeld en Geluid [CC BY-SA 3.0], via Wikimedia Commons

Without Controls

Audio by JCZA [CC BY-SA 3.0] , via Wikimedia Commons

Usage Suggestion

Under most normal circumstances, including the controls attribute should be a matter of course. The exception to this might be if you are going to create your own playback control panel using JavaScript. It would be extremely inconsiderate to your users to use the autoplay attribute while excluding the controls attribute.