图像覆盖圆圈

Question

首先让我告诉你我想要实现的目标。我想要一个如下布局（用圆圈替换正方形）：

|------------|
| |-------|  |
| | button|  |
| |-------|  |
|------------|

这是圆形图像内的按钮。按钮也应该是圆形的。我该怎么做呢？如同，是否有办法将一个圆形图像叠加在另一个上？

Answer 1

是的，可以通过在div中添加透明边缘的顶部圆圈作为背景图像（如果需要也是透明的）。要制作圆形按钮，您需要使用imagemap。

Answer 2

您可以使用PNG或GIF格式或支持透明度的任何其他格式以及在您需要支持的浏览器中工作。

但是，将单个图像与图像映射一起使用可能更容易。

Answer 3

只需使用CSS绝对定位元素，img标记在背景中，按钮在其上。将重叠元素（按钮）的z-index设置为高于背景元素。