要求是有一个图像/图形，其中有五个或六个元素以圆形方式放置在其周围和顶部。这些元素是两个短文本短语，每个短语都有更新的统计信息。它们将出现在图像的顶部，与图像的相对位置相同。这是因为图像本身包含与显示的统计数据相关的图形。
关键在于，由于此网页以不同尺寸和不同浏览器显示，因此事件元素必须始终显示在相对于图像本身的相同位置。
此类事物的一个示例(尽管实际图像和需求完全不同)是一个时钟图像，其中显示了看到的 meteor 数量以及在每个偶数小时位置检测到的地震数量。统计数据需要显示在偶数小时数旁边(上方、下方、左侧、右侧)的时钟本身。无论显示器大小、浏览器、调整大小等如何(当然在合理范围内)，都需要维护显示的统计数据与图像之间的这种关系。
最佳答案
制作一个包含所有文本和图像的页面。不用担心它出现在哪里，然后使用css样式
position:relative;
top/bottom: (x amount of pixels);
left/right: (x amount of pixels);
改变它们出现的位置。请记住，在使用“position:relative;”时它将像素添加到指定的一侧。所以
top: 20px;
会将元素向下 移动 20 像素。
您也可以根据最佳效果使用负值。
祝你好运， -布莱恩
关于css - 能否在网页上的单个图形图像周围和顶部放置多个事件元素？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11822135/