我必须使用什么来放置图像在底部颤动？

<div class="image-container"></div>

.image-container {
  width: 100%;
  height: 200px; /* 设置容器的高度 */
  background-image: url('your-image-url.jpg'); /* 设置背景图像的URL */
  background-size: cover; /* 调整背景图像的大小以适应容器 */
}

.image-container {
  position: relative; /* 设置容器为相对定位，以便后续绝对定位的子元素可以相对于其定位 */
}

.image-container::after {
  content: ''; /* 添加一个伪元素作为图像的占位符 */
  position: absolute; /* 设置伪元素为绝对定位 */
  bottom: 0; /* 将伪元素放置在容器底部 */
  left: 0; /* 将伪元素放置在容器左侧 */
  width: 100%; /* 设置伪元素的宽度与容器相同 */
  height: 100px; /* 设置伪元素的高度 */
  background-image: url('your-image-url.jpg'); /* 设置伪元素的背景图像 */
  background-size: cover; /* 调整背景图像的大小以适应伪元素 */
  transform-origin: bottom center; /* 设置变换的原点为底部中心 */
  animation: shake 2s infinite; /* 应用名为"shake"的动画效果，持续时间为2秒，无限循环 */
}

@keyframes shake {
  0% {
    transform: rotateZ(0deg); /* 初始状态，不进行旋转 */
  }
  50% {
    transform: rotateZ(5deg); /* 中间状态，顺时针旋转5度 */
  }
  100% {
    transform: rotateZ(0deg); /* 结束状态，回到初始状态 */
  }
}