输入类型图像vs按钮与背景图像

Question

在需要有图像按钮的表单中，标记更好： 要创建<input type="image">并将图像添加为源，或创建按钮元素并使用CSS将图像添加为背景？

到目前为止，我使用了带有背景图像的按钮，因为很少见<input type="image">。 <button>对移动设备更友好。但现在我在想如果图像被意外删除从服务器上怎么办？具有背景图像的按钮将不可见，但如果删除图像，则输入类型图像可以将该值用作后备。

Answer 1

HTML5规范的Image Button State documentation有点模糊：

  

input元素表示图像，用户可以从中选择坐标并提交表单，或者也可以是用户可以从中提交表单的按钮。

我认为 type=image input元素的用途是用于选择图像上的坐标，但我猜想随着时间的推移这会被误用，现在已被接受仅作为具有图像背景的输入元素。 然而在这两种情况下都表明此按钮的目的是提交表单。

简而言之：

1. 如果不是要在图片上提交表单或选择坐标，请使用<button>元素;
2. 如果预期效果是允许用户选择图像上的坐标，请使用<input>元素;
3. 如果预期效果是提交表单，请使用 - 这是个人喜好的事情（我自己使用<button>）。

Answer 2

创建一个按钮并为其添加背景将为您提供更大的样式设置灵活性

Answer 3

你应该尝试带背景的按钮。这是一个例子。

<button></button>
<style>
button{background:url(http://www.used-car.com.au/images/small%20green%20button.jpg);height:70px;width:70px}
</style>