Javascript 带有背景png的输入按钮

我正在做一个按钮输入，并试图给它一个搜索图标，而不是给它一个值=搜索和按钮说搜索它。尝试不同的外观，但没有任何效果。以下是HTML：

<input class="searchButton" type="button">

---

到目前为止，还没有好的结果。任何帮助都将不胜感激

下面是一个使用按钮而不是input type=button的示例，它允许在按钮本身中使用span标记

它确实不属于您的参数范围，因为它使用的是引导CSS，但它可以工作

---

搜索此css将在您的按钮上放置一个图像

.搜索按钮{ 宽度：30px； 高度：30px； 背景图像：urlhttps://cdn1.iconfinder.com/data/icons/hawcons/32/698627-icon-111-search-128.png; 背景位置：中心； 背景重复：无重复； 背景尺寸：25px 25px； }

---

确保图像路径正确。但是，由于要删除决定宽度的内容，所以为样式指定宽度和高度可能会有更好的效果

document.querySelector.searchButton.addEventListener'click'，函数{alert'clicked'；}； .搜索按钮{ 背景色：透明； 背景图片：url'https://cdn1.iconfinder.com/data/icons/hawcons/32/698627-icon-111-search-128.png'; 大纲：无； 背景尺寸：封面； 宽度：20px； 高度：20px； 边界：0px； 边界半径：1px； }

---

为我可能复制的作品。您确定图像的路径正确吗？控制台有任何错误吗？如果有任何答案是正确的，请考虑将其标记为“正确”以关闭该问题。谢谢

.searchButton{
background-image: url('search.png');
outline: none;
background-size: cover;
}