在html使用字体真棒的单图标声音播放器 [英] Single icon sound player in html using font awesome

问题描述

我想要一个单一的图标声音播放器，当用户点击播放声音文件...
唯一的要求是它应该是纯HTML CSS只...没有JavaScript请

I want a single icon sound player which when a user click plays a sound file... The only requirement is that it should be pure HTML CSS only... No JavaScript please

<a href="test.mp3"><i class="fa fa-sound"></a>

推荐答案

这是可能的，但只能使用javascript。您可以使用以下代码：

It is possible but only using javascript. you can do it using following code:

    <audio id="player" src="Kalimba.mp3"></audio>
    <div>
         <a onclick="document.getElementById('player').play()"><i class='fa fa-volume-up fa-2x'></i></a>
     </div>

祝你好运！

修改：

href颜色将变为蓝色。您需要添加自定义css规则以将其更改回黑色。
Google。

The href colour will make it blue. you need to add custom css rule to change it back to black. Google that.

例如：

a {
    color: black;
    background-color: transparent;
    text-decoration: none;
 }

这篇关于在html使用字体真棒的单图标声音播放器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！