当前位置: 首页 > 面试题库 >

HTML / CSS如何在输入类型=“ button”中添加图像图标?

段干瑞
2023-03-14
问题内容

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

它通常是一个比较容易使用buttonimg内:

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

但是,button用于提交的浏览器实现与所有按钮值都在button使用时发送的事实是不一致的-这取消了多次提交形式的“单击了什么按钮”检测。



 类似资料:
  • 问题内容: 我一直试图通过css更改输入按钮的背景图像,但是它不起作用。 search.html: search.css: 有什么问题吗? 甚至内联css似乎也不起作用。 问题答案: 您需要输入不带单词的单词。 两种方法都经过测试,这一方法可行。 例:

  • 我有自己的scss文件,但也需要加载jquery-ui CSS。为了实现这一点,我添加了以下webpack配置规则。 备注版本: 我的js条目文件中的下一个:

  • 在我的网站上,我有一个画廊,里面有我和我女朋友的一些照片,但是有两张照片是颠倒显示的。我不知道为什么。所有其他照片都是完美的。每张照片都是由同一个iPhone7拍摄的,但是前两张照片在网站上是颠倒的。在我的电脑上,它们显示得非常完美。 以下是网站:www.selinundleon。com/图库。有人能帮我解决这个问题吗?非常感谢你。

  • 我是第一次开发颤振应用程序。。我在添加图像时遇到问题。我有以下问题: 在哪里创建图像文件夹? 在哪里添加资产标签pubspec.ymal? 这需要任何资产文件夹吗? 我所尝试的: 在pubspec内部。ymal: 完整文件: 错误日志: 我的主菜。dart代码: 我指的是这个教程https://flutter.io/tutorials/layout/ 此外,我想问,有没有在颤振清洁重建的工具,因为

  • 正如你在下面的代码片段中看到的,我很难让蓝色覆盖贴在图像上,但是正如你所看到的,在左侧,由于某种原因,它没有贴在图片上。是的,我希望一整列的位置比另一列低/高一点,所以这里我尝试将整列1定位70px,但它撕裂了蓝色覆盖层和图像。有什么想法吗? null null

  • 分析块映射时需要密钥。|66 |-图片| ^ |请更正pubspec。pubspec的yaml文件。yaml出口代码1