css样式1.定义父容器样式，控制图标位置，为整个页面添加背景色顺便方便预览body{background:rgba(73,74,95,1);}.container{width:170px;高度：170px；位置：相对；margin:250pxauto;}2.彩虹样式，彩虹有摆动动画效果.rainbow{width:70px;高度：70px；位置：绝对；顶部：70px；左：80px；左边距：-40px；边界半径：170px000；#f99716-4px-4px03px，#fee124-6px-6px05px，#afde2e-8px-8px07px，#6ad7f8-10px-10px09px，#60b1f5-12px-12px011px，#a3459b-14px-14像素013像素；动画：彩虹5s无限缓入缓出；变换：旋转（40度）；}@keyframes彩虹{50%{变换：旋转（50度）；动画yo.rainbow::after{内容：'';宽度：120px；高度：15px；位置：绝对；底部：-23px；左：17px；背景：#000；边界半径：50%；不透明度：0.2；;变换：旋转（-40deg）；transform-origin:50%50%;}@keyframesrainbow_shadow{50%{transform:rotate(-50deg)translate(10px)scale(0.7);不透明度：0.05；}}完成，是不是很简单？跟着一起去实现吧，你也可以画出美丽的彩虹哦~