html - 我无法移动图像，我该怎么办？

Question

我正在尝试移动图像 (map.png)，但我无法移动它。

我的 HTML 代码是:

<div class="map">      
    <h3 style="text-align:right;" >
    <img src="img/map.png" alt="">
    </h3>
    </div>

我的 CSS 代码是:

.map {
  position: relative;
  top: 20px;
}

我有一个 GitHub 存储库: https://github.com/t0091/bootstrap

Answer 1

我仍然不确定您实际想要实现的目标。但是，我已经为您编写了代码，并以图像垂直和水平居中的方式重新编写了代码。您可以在 .image-content 类中添加任何您想要的 css。

HTML

<div class="flex-display">
<div class="image-content">
    <img src="https://via.placeholder.com/150" alt=""> //Use you correct image path
</div>
</div>

CSS

.flex-display {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

.image-content {
  // Write your image styling here if needed
}