如何使下面给定形状的容器在高度= 130，宽度= 300的情况下颤动

要使下面给定形状的容器在高度= 130，宽度= 300的情况下颤动，可以通过使用CSS动画和关键帧来实现。

首先，我们需要创建一个包含所需形状的HTML元素，比如一个div容器。然后，使用CSS来定义容器的样式，包括宽度、高度和颜色等。

接下来，我们可以通过使用@keyframes规则定义一个动画序列，该序列描述了容器在指定时间内如何进行颤动。在动画序列中，可以使用transform属性来改变容器的位置、旋转或缩放等效果，以实现颤动的效果。

最后，将定义的动画序列应用到容器上，使其开始执行。可以通过使用animation属性来指定动画序列的名称、持续时间和重复次数等。

以下是一个示例代码，实现了一个简单的容器颤动效果：

HTML代码：

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

CSS代码：

.container {
  width: 300px;
  height: 130px;
  background-color: blue;
  animation: shake 1s infinite;
}

@keyframes shake {
  0% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(10px) rotate(5deg);
  }
  50% {
    transform: translateX(-10px) rotate(-5deg);
  }
  75% {
    transform: translateX(10px) rotate(5deg);
  }
  100% {
    transform: translateX(0);
  }
}

在上述代码中，我们创建了一个名为.container的div容器，并定义了宽度、高度和背景颜色。然后，使用@keyframes规则定义了一个名为shake的动画序列，其中描述了容器在不同时间点的变化。最后，通过将动画序列应用到容器上的animation属性，使得容器开始执行颤动动画。

这是一个简单的示例，你可以根据需要进行调整和扩展。关于CSS动画和关键帧的更多细节和技巧，你可以参考相关的CSS文档和教程。

参考链接：