图像被推/浮动到边缘

Question

不幸的是，我无法将图像移动到屏幕边缘。

<section class="hero-main">
<div class="container">
    <div class="row">
        <div class="col-lg-6">
            <div class="hero-main__container">
                <div class="hero-main__header">
                    <h1>Lorem ipsum dolor sit amet<br> amet amet amet</h1>
                </div>
                <div class="hero-main__text">
                    <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna.</p>
                </div>
            </div>
        </div>
        <div class="col-lg-6">
            <img src="images/map-flag.png" style="margin-left: 107px" class="" alt="">
        </div>
    </div>
</div>

我要实现的效果显示在屏幕截图中。

不幸的是，我的代码无法将照片放置在边缘，如果我按下它，它将无法响应。

Answer 1

可能会对v2有所帮助

const parent = document.querySelector(".parent");
const children = [...parent.children];
[children[1].innerHTML, children[3].innerHTML] = [
  children[3].innerHTML,
  children[1].innerHTML
];

或者可能是

<div class="parent">
   <div>1</div>
   <div>2</div>
   <div>3</div>
   <div>4</div>
</div>