,页面中如果有两种或多种指定颜色之间的平滑过渡的渐变效果，会使得我们的视觉效果瞬间提升几个档次，在CSS3中有提供的多个渐变方式属性就能让我们轻松实现这样的渐变效果。,目前CSS渐变属性有六个，分别为:linear-gradient(线性渐变),repeating-linear-gradient(重复线性渐变),radial-gradient(径向渐变),repeating-radial-gradient(重复径向渐变),conic-gradient(锥形渐变),repeating-conic-gradient(重复锥形渐变); CSS渐变属性作用是从一种颜色平滑渐变到另一种颜色的图像，那么background-image和border-image属性都可以用渐变作为图片内容。 下面，我们就分别来看看这几个属性的效果,线性渐变以直线的方式，可向左、向右、向上、向下、对角方向延伸，使用频率很高。要创建线性渐变,需要指定两种及以上的颜值和方向，如果未指定方向，默认为上到下渐变。
使用语法:,
,默认从上到下。,
,指定方向从左上角到右下角。,
,指定方向从左上角到右下角,设置多种渐变颜色。,
,
,指定方向从左上角到右下角,设置多种渐变颜色及颜色作用位置。,repeating-linear-gradient用得可能比较少，它是基于linear-gradient进行重复平铺操作。,
,前面都是渐变背景，我们再来看看渐变边框是什么效果。,
,径向渐变以由中心点由圆或者椭圆向外扩散，使用语法。,
,,一般情况下，用conic-gradient的场景比较少,但我们也可以基本了解一下。其基本语法：,
,,
文章版权声明
1 原创文章作者：cmcc，如若转载，请注明出处： https://www.52hwl.com/21867.html
2 温馨提示：软件侵权请联系469472785#qq.com（三天内删除相关链接）资源失效请留言反馈
3 下载提示：如遇蓝奏云无法访问，请修改lanzous(把s修改成x)
4 免责声明：本站为个人博客，所有软件信息均来自网络 修改版软件，加群广告提示为修改者自留，非本站信息，注意鉴别
微信扫一扫 
支付宝扫一扫 