html - オーディオ タグの GUI が表示されない

Question

ページに音声タグを含めました

<audio src='a.mp3' preload='auto'>
</audio>

しかし、機能していません。ページに何も表示されません。

しかし、audiojsを次のように含めると

  <script src="/static/js/audiojs/audio.min.js"></script>
  <script>
    audiojs.events.ready(function() {
      var as = audiojs.createAll();
    });

  </script>

なぜそうなのか疑問に思っています。

Answer 1

私が学んだことから、src はオーディオ内の要素であり、属性ではありません。したがって、コードは次のようになります。

<audio controls="controls">
  <source src="song.ogg" type="audio/ogg" />
  <source src="song.mp3" type="audio/mpeg" />
  Your browser does not support the audio element.
</audio>

（ソース）

編集: src も属性になる可能性があるため、それは問題ではありませんでした。ブラウザが音声用に何かを表示するには、「controls」属性が必要です。ただし、デフォルトのコントロールが不要な場合は、html ボタンを追加し、JavaScript でオーディオの開始/停止などを制御します。

Answer 2

これを試して：

<audio src='a.mp3' controls preload='auto'>
</audio>

Answer 3

それはあなたのCSSです。

    audio{
        min-width: 400px;
        height: auto;
        object-fit: inherit;
    }