文字动态颜色变化效果

被你发现了,哈哈哈。这是一个有趣的小Demo哇。

 鼠标左键键扫描选中上面区域查看效果

.gradient-text {
    background-image: linear-gradient(90deg, $red, $orange);
    background-clip: text;
    line-height: 60px;
    font-size: 60px;
    animation: hue 5s linear infinite;
    -webkit-text-fill-color: transparent;
}
@keyframes hue {
    from {
        filter: hue-rotate(0);
    }
    to {
        filter: hue-rotate(-1turn);
    }
}


<div class="bruce flex-ct-x">
    <h1 class="gradient-text">Full Stack Developer</h1>
</div>
原文地址:https://www.cnblogs.com/wxhhts/p/11551605.html