文字颜色渐变特效

<!DOCTYPE html>
<html>

    <head>
        <meta charset="gbk">
        <title></title>
        <style type="text/css"> @media (min-width: 650px) { .mega { color: #7b8993; font-size: 6rem; line-height: 1; } } h1 { font: 100%/2.5 "Roboto", Verdana, sans-serif; -webkit-animation: bounceInUp 1s; } .site__title { display: block; text-align: center; color: blueviolet; background-image: -webkit-linear-gradient(0deg, #f35626, #feab3a); -webkit-background-clip: text; -webkit-text-fill-color: transparent; -webkit-animation: hue 10s infinite linear; } @-webkit-keyframes hue { from { -webkit-filter: hue-rotate(0deg); } to { -webkit-filter: hue-rotate(-360deg); } } </style>
    </head>

    <body>
        <h1 class="site__title mega">我是你大爷</h1>
    </body>

</html>

你可能感兴趣的:(颜色渐变)