.colorful-text {  
    /* 其他样式 */  
}  
  
#animated-text {  
    /* 初始颜色或渐变效果 */  
    background: linear-gradient(to right, red, yellow, green);  
    -webkit-background-clip: text;  
    background-clip: text;  
    color: transparent;  
    transition: transform 0.3s; /* 为倾斜添加过渡效果 */  
}  
  
.colorful-text:hover #animated-text {  
    transform: skew(-10deg); /* 鼠标悬停时文字倾斜 */  
}