css3彩虹渐变色,css3渐变彩虹条纹

linear-gradient 常用来制作渐变，如

(色彩渣，我就随便找个颜色举例)

css代码如下

background:linear-gradient(45deg,#ff0000 0%,#ffb600 11%,#fff600 22%,#a5ff00 33%,#00a9ff 44%,#0400ff 55%,#8a00fc 66%,#ff00e9 77%,#ff0059 88%,#ff0000 100%);

如果想制作条纹，很简单啦

background:linear-gradient(45deg,#ff0000 0%,#ff0000 11%,

#ffb600 11%,#ffb600 22%,

#fff600 22%,#fff600 33%,

#a5ff00 33%,#a5ff00 44%,

#00a9ff 44%,#00a9ff 55%,

#0400ff 55%,#0400ff 66%,

#8a00fc 66%,#8a00fc 77%,

#ff00e9 77%,#ff00e9 88%,

#ff0000 88%,#ff0000 100%);

效果

径向同理

background:radial-gradient(#ff0000 0%,#ff0000 11%,

#ffb600 11%,#ffb600 22%,

#fff600 22%,#fff600 33%,

#a5ff00 33%,#a5ff00 44%,

#00a9ff 44%,#00a9ff 55%,

#0400ff 55%,#0400ff 66%,

#8a00fc 66%,#8a00fc 77%,

#ff00e9 77%,#ff00e9 88%,

#ff0000 88%,#ff0000 100%);

原文：http://www.cnblogs.com/gongchengshi1803275951/p/4086969.html

css3彩虹渐变色,css3渐变彩虹条纹相关推荐

***CSS3 Gradient渐变色（转：http://www.w3cplus.com/content/css3-gradient）
CSS3 Gradient分为linear-gradient(线性渐变)和radial-gradient(径向渐变).而我们今天主要是针对线性渐变来剖析其具体的用法.为了更好的应用CSS3 Gradi ...
【iOS】彩虹渐变色的 Swift 实现
首先很感谢大家的支持与关注.<Web Color 的 Swfit 实现>一文一经公布.訪问量迅速攀升,让本人受宠若惊. 为表达感激之情,今天早上把彩虹渐变也顺手实现了. 最新代码& ...
html中按钮怎么设置渐变色,CSS3渐变色按钮
上一篇文章介绍了css3的渐变色属性,今天带来CSS3渐变特性的应用.可以去看一组按钮,我只用了 CSS创建完成的渐变按钮(不需要图片和Javascript). 这些按钮可以根据字体的大小伸缩.当填充 ...
html字体渐变颜色的设置颜色代码,使用CSS3实现字体颜色渐变的实现
在使用Animation.css的时候发现它的官网字体会渐变,看了一下他的css很有趣 .site__title { color: #f35626; background-image: -webkit ...
html边框颜色线性渐变,css3设置边框颜色渐变的方法有哪些
css3设置边框颜色渐变的方法有哪些发布时间:2020-09-14 14:51:54 来源:亿速云阅读:110 作者:小新 css3设置边框颜色渐变的方法有哪些?这个问题可能是我们日常学习或工作经 ...
HTML怎么做出菱形框架,css3怎么实现菱形渐变？
本篇文章介绍了css3实现菱形渐变的效果,有着一定的参考价值,现在将它分享给各位,希望对各位有帮助. css3怎么实现菱形渐变 1.实现菱形渐变,首先需要实现一个菱形,使用了clip-path属性:. ...
动态导航多级下拉菜单 html,css3实现的多级渐变下拉菜单导航效果代码
本文实例讲述了css3实现的多级渐变下拉菜单导航效果代码.分享给大家供大家参考.具体如下: 这是一款基于css3实现的下拉菜单导航,是非常漂亮的动画菜单,而且是多级菜单的形式,测试时发现可支持5级,估 ...
css3倒圆角边框,css3实现圆角边框渐变
原标题:css3实现圆角边框渐变渐变的形式:可选参数有两种方式- 1.设置旋转角度,0度代表水平从左到右,90度就是从上到下啦,从0度开始逆时针变换. 2.使用关键字,left代表从左到右,top ...
【CSS3教程】CSS3基础常用技巧实例集合
为什么80%的码农都做不了架构师?>>> CSS3常用技巧 CSS3下条纹&方格斜纹背景的实现一.效果抢先:CSS3下的条纹背景demo 这些美丽的纹饰全部都是由CS ...

css3彩虹渐变色,css3渐变彩虹条纹

css3彩虹渐变色,css3渐变彩虹条纹相关推荐

最新文章

热门文章

css3彩虹渐变色,css3渐变 彩虹条纹

css3彩虹渐变色,css3渐变 彩虹条纹相关推荐

最新文章

热门文章

css3彩虹渐变色,css3渐变彩虹条纹

css3彩虹渐变色,css3渐变彩虹条纹相关推荐