使用 HTML/CSS 将图像作为按钮的背景颜色问题，如何解决？

Question

我正在尝试使用一些图像作为页面主体的黑色背景按钮。不幸的是，该按钮在图像内容后面有一个白色背景，我无法删除它，因为我希望按钮的背景与主体背景的颜色相匹配。我尝试过背景颜色、背景和颜色以及其他一些我不记得的尝试。这是我当前的音频按钮代码，这是一种不起作用的尝试：

.audiobutton {
    background-color: black;
    appearance: none;
    border: none;
    height: 40%;
    width: 25%;
    position: relative;
    z-index: 1;
}

它产生了所附截图中看到的效果，在像W3这样的网站上搜索后我不知道如何达到所需的效果。

如果有人想知道与按钮相关的 HTML，这里是：

<a class="audiobutton" href="audio.html">
            <button type="link">
                <img src="Renders/1-alpha-v2.png" alt="audiobutton"/>
            </button>
        </a>

Answer 1

首先请考虑您的按钮应该永远是a的子按钮。这可能会解决您的问题，还请提供代码片段并确保图像采用可接受的格式并且没有背景