文本表格框HTML背景图像

Question

我有一个文本表单，用户应在其中输入电子邮件地址。我希望这个文本表单能够将图像作为背景。

这是我到目前为止所拥有的：

HTML：

<form action="addemailtodatabase.php" method="post">
<input class="emailinput" type="text" name="email" maxlength="80"/>
<input type="submit" name="submit" value="Sign Up"/>
<input type="hidden" name="submitted" value="TRUE"/>
</form>

CSS：

.emailinput{
    background-image:url(images/desktop/field-normal.png);
    background-repeat:no-repeat;
    border:none;
    width:296px;
    height:62px;
}

我无法摆脱图像背后的白色背景（它不是图像文件，有圆角而且没有白色位）。

这是它的样子：

有什么建议吗？感谢。

Answer 1

由于您没有使用重置或默认样式清除样式表，因此您还需要设置background-color属性。您可以将其设置为transparent。

Answer 2

您的CSS将是这样的：

.emailinput{
    background-image: #000 url(images/desktop/field-normal.png) no-repeat;
    border:none;
    outline:none;
    width:296px;
    height:62px;
}