javascript - 即使屏幕分辨率发生变化，我如何让我的图像在页面上移动

Question

我有一个图像从屏幕的一侧到另一侧。但是，当我在不同尺寸的计算机/笔记本电脑上打开 HTML 时，它不适合并且看起来不合适。我该如何解决这个问题？

代码:

body {
  text-align: center;
}
div.container {
  text-align: left;
  width: 710px;
  margin: 0 auto;
  border: 12px solid black;
  border-radius: 10px;
}
div.content {
  width: 700px;
  min-height: 400px;
  background-color: white;
  padding: 5px;
}
@-webkit-keyframes mini {
  from {
    left: 410px;
  }
}
.mini {
  position: absolute;
  top: 280px;
  left: 950px;
  width: 166px;
  height: 70px;
  z-index: 10000;
  -webkit-animation: mini 3s;
  animation: mini 8s;
}

<div class="container">
  <div class="content">
    <img src="Media/buscartoon.jpg" class="mini" />
  </div>
</div>

Answer 1

可以设置初始的 left 和 top 值

 .imganim {
        width:100px;
        height:60px;
        position:absolute;
        -webkit-animation:myfirst 5s;
        animation:myfirst 5s;
        left: 0;
        top: 0;
    }