css - CSS背景图片仅适用于Firefox

在搜索按钮上，我创建了背景图片，该背景图片仅在Firefox中显示，而在其他浏览器（选中的Chrome，IE和Opera）中则不显示。

这是我的HTML（由Joomla生成）：

<input class="button" type="image" onclick="this.form.searchword.focus();" src="/dev/" value="Search">

这是我的CSS：

#search .search .button{
    background: #1B3F8B url('../images/search_btn.png') no-repeat center center;
    border:1px solid #1B3F8B;
    width:22px;
    height:32px;
    float:right;
}

我的图像是RGB .png

奇怪的是，我看到它已加载到Google Chrome中，但半秒钟后它消失了，并显示了常规的“未加载图像”图像。

我似乎找不到这个问题的答案，任何人对此问题有任何经验或知道我做错了什么？

最佳答案

您需要将type="image"更改为type="button"。由于背景图片在css类中，因此您也可以从HTML标记中删除src。

标记如下所示：

<input class="button" type="button" onclick="this.form.searchword.focus();" value="Search">

您还需要更新CSS以添加逗号：

#search, .search, .button{

关于css - CSS背景图片仅适用于Firefox，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/19734305/