html - 使用 CSS 添加图像以提交按钮

Question

我正在尝试使用 CSS 制作包含图像的 sumbit 按钮。这是代码:

HTML

<input type="submit" id="search" name="submit" alt="search" >

CSS

input#search{
    background:url(../search-icon.png);
    background-repeat: no-repeat;
    width:40px;
    height:40px;
}

这将返回此提交按钮，但我不希望出现“提交”一词或灰色方框。

如果有人能提出可能是什么问题，我们将不胜感激。

Answer 1

灰色框是由添加到提交按钮的默认边框引起的。而提交文本是按钮的默认值。

HTML:

<input type="submit" id="search" name="submit" alt="search" value="">

CSS:

input#search    {
background:url(../search-icon.png);
background-repeat: no-repeat;
width:40px;
height:40px;
border: 0;
}