Question

我正在创建一个基于Web的（HTML，CSS，Javascript，VueJs）解剖工具。我有一个身体部位清单作为检查清单。我还有一个人体图像，单击清单时会添加其器官。

例如，如果您单击清单上的“左手”选项，则左手将添加到身体图片中。

现在我想知道：

1-如何将身体部位的图片放置在希望放置的位置和角度。

2-如何设置代码，以便通过单击清单将相应的身体部位添加到身体图像中？

Answer 1

您可以完全定位图像-如果图像是具有透明背景的png文件，则可以旋转它们以使其适合页面上的任何位置，并且它们将无缝显示。您可以仅使用CSS来完成全部操作。没有示例，将很难为您提供明确的答案，但是如果您从该项目开始，以使其位于页面上方

position: absolute;
top:-400px;

然后选中此复选框，您可以切换类，新类可以具有-

之类的样式

position: absolute;
top: 37px;
left: 283px;
transform: rotate(20deg);

Answer 2

将全身图像分成较小的部分，并用网格系统进行排列。例如，将图片分成9 * 12张，然后单击清单显示/隐藏图片。