HTML / CSS 如何将图像图标添加到输入类型 =“按钮”？

[英] HTML / CSS How to add image icon to input type="button"?

发布于05月27日 • html

我正在使用下面的CSS，但它会在按钮的中心放置一个图像.有没有办法用<input type="button">左对齐或右对齐图标，这样文本和图像就能很好地匹配和对齐？

background: url('/common/assets/images/icons/16x16/add.png');
background-position:center;
background-repeat:no-repeat;

如果你一定要用input，试试这个:

background-image: url(...);
background-repeat: no-repeat;
background-position: <left|right>;
padding-<left|right>: <width of image>px;

通常情况下，使用内含img的button会更容易一些:

<button type="submit"><img> Text</button>

然而，用于提交的button的浏览器实现是不一致的，而且所有按钮值都是在使用button时发送的-这会扼杀多提交表单中的"单击了什么按钮"检测.

关注我们

课程推荐

教程推荐