javascript - 如何使用像素将元素附加到页面的特定区域

Question

我正在尝试将图像附加到页面的特定区域（中间）。目前，图像出现在我页面的最底部。谁能告诉我如何更改图像出现的位置？

    function picture(){
        var img = new Image();
        img.src = 'youwin.png';
        document.body.appendChild(img);
    }
} picture();

标签： javascriptjqueryappendchild

Answer 1

这可能是position: absolute你的 CSS 的一个很好的用例。我举了一个小例子，这是你想要做的吗？.

在我链接的示例中，我在图像周围包裹了一个 DIV，以使将图像放在中心更容易一些，但您也可以通过自己设置图像的样式来做到这一点。

image {
  position: absolute;
  left: 0;
  top: 0;
  padding-top: 5px;
}

使用left和top值来移动您的图像！

如果您希望图像居中，我认为最简单的方法是在图像周围包裹一个 DIV 并设置 div 的样式。试试text-align: center我的例子。

当您查看如何设置 DIV 样式时，您甚至可以查看flexbox以获得一些选项！