CSS彩虹字效果样式

原创 木鱼  2017-08-29 07:30  阅读 206 次

直接上效果

木鱼博客的彩虹糖

附上代码:

.caihong1 {
    background-image: 
        -webkit-gradient( linear, left top, right top, color-stop(0, #f22), 
        color-stop(0.15, #f2f), 
        color-stop(0.3, #22f), 
        color-stop(0.45, #2ff), 
        color-stop(0.6, #2f2),
        color-stop(0.75, #2f2), 
        color-stop(0.9, #ff2), 
        color-stop(1, #f22) );
    color: transparent;
    -webkit-background-clip: text;
}

<p class="caihong1">木鱼博客的彩虹糖</p>

本文地址:https://www.m5yu.com/css-caihong.html
关注我们:请关注一下我们的微信公众号:扫描二维码,公众号:木鱼博客
版权声明:本文为原创文章,版权归 木鱼 所有,欢迎分享本文,转载请保留出处!

发表评论