网页自动调整图片大小

Question

我有一个按钮类型的按钮，我想放置一张图像。我的代码如下所示:

<button id="button" type="button" onclick="bus()">
  <img src="DestinationH-Bus-Driver-Login.png">
</button>

这样做的问题是，我会得到一个灰色空间，使整体图像过大，如果我使用更大的图像，它就可以正常工作。但是，如果我从手机上调用网站，那么这些大按钮突然就太小了，无法看清。任何建议都将不胜感激。

我知道有类型图像，但我不能使用它，因为它给我一个提交类型的按钮，而我想要一个按钮类型的按钮，但是如果我使用图像类型，而不是上述方法，图片确实可以很好地工作。

- Revin

---

我们在盲目地工作。请给我们展示代码。 - Diodeus - James MacFarlane

Answer 1

为什么不直接将 onclick 事件放在图片上？

<img src="DestinationH-Bus-Driver-Login.png" onClick="bus()" />

- Niet the Dark Absol

Answer 2

如果需要的话，您可以使用类型为图像的标签，并通过返回false来取消事件处理程序中的默认表单提交：

<input type="image" src="DestinationH-Bus-Driver-Login.png" onclick="bus(); return false;"/>

这样做可以让你拥有与button标签相同的功能，但更好地支持跨浏览器使用图像进行样式设置。

- Matt Coughlin