如何使用 html 将图像放在链接按钮上方？答案

【问题标题】：How do I put an image above a linked button using html?如何使用 html 将图像放在链接按钮上方？
【发布时间】：2016-08-19 18:12:32
【问题描述】：

所以在这里我有一个结帐按钮和一个显示在该按钮左侧的图像...我怎样才能获得按钮上方的图像？

<a href="https://www.e-junkie.com/ecom/gb.php?c=cart&ejc=2&cl=282297&i=1381026" target="ej_ejc" class="ec_ejc_thkbx" onclick="return EJEJC_lc(this);">

<img src="https://d1yoaun8syyxxt.cloudfront.net/vi310-007a1757-ab94-4219-871c-fd4541c768dd-v2" alt="Faith Walker" style="height:200px;width:200px;">

<img src="https://www.e-junkie.com/ej/ej_add_to_cart.gif" border="0" alt="Add to Cart">
</a>

【问题讨论】：

将img标签放在按钮上方和img标签之后
你能提供更多代码吗？

标签： html image button

【解决方案1】：

如果您想要一个图像按钮，请使用以下代码： `

<input type="image" src="https://d1yoaun8syyxxt.cloudfront.net/vi310-007a1757-ab94-4219-871c-fd4541c768dd-v2"/>

如果您只想要按钮上方的图像： `

<img src="https://d1yoaun8syyxxt.cloudfront.net/vi310-007a1757-ab94-4219-871c-fd4541c768dd-v2" alt="Faith Walker" style="height:200px;width:200px;">
<br>
<img src="https://www.e-junkie.com/ej/ej_add_to_cart.gif" border="0" alt="Add to Cart">
<br>
<a href="https://www.e-junkie.com/ecom/gb.php?c=cart&ejc=2&cl=282297&i=1381026" target="ej_ejc" class="ec_ejc_thkbx" onclick="return EJEJC_lc(this);">
</a>

【讨论】：

【解决方案2】：

您可以使用 css z-index:99 或比按钮更高的数字将其置于按钮上方

【讨论】：

我相信 OP 想要改变内容的浮动，而不是 z-index 的分层。
您能否提供您创建的代码并设置按钮样式

【解决方案3】：

您最好的选择可能是将图像放在代码中的按钮之前，并将带有 CSS 的 display: block; 应用于图像（使用 style="" 内联或在您的样式表中）。

【讨论】：