Question

我正在尝试移动使用javascript创建的这些图像。我有多个用javascript创建的图像，当我按按钮生成它们时，所有图片按照创建顺序从左到右堆叠。我想将其中一些放置在网站上。不知道该怎么做。

以下是其中一张使用javascript创建的图片的代码，其他图片完全相同，只是名称不同：

var headPic = document.createElement("img");
  headPic.src = headList[head];
  document.body.appendChild(headPic);

Answer 1

您可以考虑使用flexbox。

您可以参考 web page：

您也可以尝试我的代码。

headList=[];
headList[0]="https://image.flaticon.com/icons/svg/1373/1373204.svg";
headList[1]="https://image.flaticon.com/icons/svg/1373/1373203.svg";
headList[2]="https://image.flaticon.com/icons/svg/1373/1373208.svg";
function go()
{
		var container=document.getElementById("container");
    for (var i=0;i<headList.length;i++)
    {
    	var img=document.createElement("img");
      img.src=headList[i];
      container.append(img);
    }
}

div.container
{
  display:flex;
  flex-direction:row;
}

<div class="container" id="container">

</div>
<button onclick="go()">
  Go
</button>

如何移动此图像的位置？

1 个答案: