在html5中将多个按钮放在图像上的好方法是什么？

Question

我希望这样做，而不是每次指定图像的大小，我想在任何放置在页面上的地方工作。

我尝试过的是使用数字标签并播放内部相对位置的图像和按钮。

<figure>

<img src="myImage.jpg">

<button style='position:relative; left:0px; bottom:0px' type='button'>+</button>

<button style='position:relative; left:0px; bottom:50px' type='button'>+</button>

</figure>

我不确定我改变了什么因为曾经在图像上放置加号，但现在它将它放在图像旁边。另外，我希望第二个按钮垂直地直接在第一个按钮的左侧，但是在它的左边有空间。

Answer 1

确切的左侧和顶部将取决于图像大小。两个按钮都应该有绝对位置。

在css下方按下按钮

.btnClass{
position: absolute;
left: 150px;
top: 160px;
}

这里左边和上边应该是图像宽度和高度的一半，我已经放置了一些样本值

找到这个here;

的小提琴