造型按钮与图像？

Question

我一直在尝试使用图片设置提交按钮的样式。我会使用CSS，但按钮设计过于复杂。我尝试将背景图像添加到按钮，但图像位置不正确。我也尝试过使用

<input type="image" src="myimage.png">

但是这不是一个提交按钮所以它不起作用。我已经查看并尝试了我认为可能的所有内容，但无法找到使按钮提交表单的解决方案。感谢。

Answer 1

如果<input type="image">无法正常工作，请尝试改为

<button type="submit"><img src="myimage.png"></button>

但正如我在上面写的评论你的代码应该也可以正常工作

Answer 2

使用按钮元素并使用css设置样式。不要省略文本，你的表格应该是accessible没有图片或css。

<button type='submit'>Informative submit text</button>

button {
    background-image:url('myimage.png');
}

Answer 3

您有不同的提交按钮可能性：

<input type="image">
<input type="submit">
<button></button> <!-- no type needed, since submit is the default type -->

这些都是提交按钮。选择最适合你的那个。

现在您可以选择在按钮之间放置图像或使用背景图像并正确放置它们。

带背景图片的按钮示例：fiddle

Answer 4

如果有人需要更新的html5答案：

<button id='' name=''  value='' ><img src='img.jpg' /></button>

Answer 5

<input type="image" src="myimage.png">

或

<input type="submit" style="background:url(myimage.png)">