主页 / 问题 / 1254479
Accepted
spartakus
Asked:2022-03-11 20:34:33 +0000 UTC2022-03-11 20:34:33 +0000 UTC

图片按钮。如何将自己的图片或照片添加到按钮？[关闭]

  • 772

大家好。我想将图像添加到按钮。我希望能得到你的帮助。

button

2 个回答

  1. https://jsfiddle.net/nog2kuta/

    .ico {
  background: url(//www.gravatar.com/avatar/cbfaff96665b7567defe1b34a883db8b?s=32&d=identicon&r=PG);
  width: 32px;
  height: 32px;
  display: inline-block;
}

button {
  padding: 3px;
}

button span {
  display: inline-block;
  vertical-align: middle;
}
    <button>
  <span class=ico></span>
  <span>And some text</span>
</button>

    适用于 Chrome、FF、IE（在 11 中测试）和 Opera 12

    • 2
  2. Best Answer

    如果有标签无关紧要button，您可以使用input[type="image"]它来src简单地插入任何图片：

    [type="image"] {
  width: 100px;
  transition: .3s;
}
[type="image"]:hover {
  opacity: .8;
}
    <input type="image" role="button" src="https://cdn.pixabay.com/photo/2013/07/13/13/13/button-160595_640.png">

    • 2

相关问题