Css 如何在提交按钮中设置背景图像？

如何在提交按钮中设置背景图像

我必须使用图像来代替常规的提交按钮吗？在xhtml/css中哪种方式最好

---

按钮在所有主要浏览器（包括IE6、IE7）中的外观应相同。通常，用户会使用一个（或多个）图像标记，可能会结合在css中设置div背景图像作为提交按钮。实际提交将在单击事件时用javascript完成

---

关于这个主题，我通常的做法是使用以下css：

.button {
    border: none;
    background: url('/forms/up.png') no-repeat top left;
    padding: 2px 8px;
}

div#submitForm input {
  background: url("../images/buttonbg.png") no-repeat scroll 0 0 transparent;
  color: #000000;
  cursor: pointer;
  font-weight: bold;
  height: 20px;
  padding-bottom: 2px;
  width: 75px;
}

以及标记：

<div id="submitForm">
    <input type="submit" value="Submit" name="submit">
</div>

---

如果在不同的浏览器中出现不同的情况，我恳请您使用重置样式表，将所有边距、填充，甚至边框设置为零。

您可以尝试以下代码：

background-image:url('url of your image') 10px 10px no-repeat

我是这样做的 封面按钮和中间的图像

<button><img src="foldername/imagename" width="30px" height= "30px"></button>

background

是一次设置多个后台属性的缩写<代码>背景图像只是设置url。我很感激这是一篇老文章，猜测@Pratik没有遇到任何问题，但我偶然发现了这一点，忍不住注意到您在这里选择提交输入元素的方式。您正在submitForm

中选择全局

输入

元素，因此样式将应用于

等元素。我会考虑设置一个反对提交输入的类，或者使用<代码>输入[type =“提交”] < /代码>来选择按钮。