用css写一个页面打开时的炫酷动画效果

当页面打开时，可以使用CSS动画来制作炫酷的效果。例如，可以使用 keyframes 关键字来定义动画，然后使用 animation 属性来将动画应用到元素上。以下是一个 CSS 动画示例：

<style>
  .my-div {
    width: 100px;
    height: 100px;
    background-color: red;
    animation: flip 2s ease-in-out;
  }
  
  @keyframes flip {
    from { transform: rotateY(0deg); }
    to { transform: rotateY(360deg); }
  }
</style>

<div class="my-div"></div>

这个例子中，当页面加载时，一个红色的正方形会从中心位置逐渐旋转，并在 2 秒钟内完成一次完整的 360 度旋转。你可以根据需要修改动画的细节，例如颜色、旋转方向和速度等等。