当鼠标悬停在伪元素上时触发CSS动画？

当鼠标悬停在伪元素上时触发CSS动画，可以通过使用CSS的:hover伪类选择器来实现。伪元素是通过CSS选择器创建的虚拟元素，可以在元素的内容之前或之后插入额外的内容。

要实现这个效果，可以按照以下步骤进行操作：

1. 创建一个包含伪元素的CSS选择器，例如：

.element::before {
  content: "";
  /* 伪元素的样式属性 */
}

1. 使用:hover伪类选择器来定义鼠标悬停时的样式，例如：

.element:hover::before {
  /* 鼠标悬停时伪元素的样式属性 */
}

1. 在:hover伪类选择器中定义CSS动画效果，例如：

.element:hover::before {
  animation: myAnimation 1s ease-in-out;
}

@keyframes myAnimation {
  /* 定义动画的关键帧 */
}

在上述代码中，.element表示要应用动画效果的元素，::before表示要创建的伪元素。通过:hover伪类选择器，当鼠标悬停在元素上时，会应用:hover伪类选择器中定义的样式，包括动画效果。

关于CSS动画的更多信息和用法，可以参考腾讯云的CSS动画介绍页面：CSS动画介绍。

请注意，以上答案仅供参考，具体的实现方式可能会根据具体的项目需求和代码结构而有所不同。