我正在使用下面的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;

通常情况下,使用内含imgbutton会更容易一些:

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

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

Html相关问答推荐

表情符号使显示:块 div 更高

为网站上的非 html 文件设置标题和网站图标

垂直图像调整大小. (弹性或垂直)

不使用 z-index 的卡片动画

类内没有标签的css样式文本

难以构建网页

左右引号在 Safari 中呈现为意外字符

内部弹性框无法在末尾对齐带有伪元素的标签

如何从 div 内的另一个页面显示不完整的 HTML

div溢出其父div的问题

网格(grid)、边框(border)和锚(anchor)样式的奇怪行为

如何合并数据表中的 2 行单元格?

更改复选框的 colored颜色

使用smoke动画减小ring大小

如何在显示块 div 中移动文本

悬停状态之间的元素高度转换

如何重复网格自动行的高度

与 target="_blank" 和 rel="noopener noreferrer" 的链接仍然容易受到攻击?

Swift:在标签或文本视图中显示 HTML 数据

CSS:改变父母对子元素的关注