纯css实现彩虹转盘动画效果代码-html代码-BFW代码库

纯css实现彩虹转盘动画效果代码

代码语言：html

所属分类：动画

代码描述：纯css实现彩虹转盘动画效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="UTF-8">






    <style>
        html {
            overflow: hidden
        }
        body {
            background: gainsboro;
        }
        .rainbow-wheel {
            position: relative;
            margin: 1em auto;
            border: solid 2em white;
            width: 16em;
            height: 16em;
            border-radius: 50%;
            background:
            linear-gradient(36deg, #272b66 42.34%, transparent 42.34%) 0 0,
            linear-gradient(72deg, #2d559f 75.48%, transparent 75.48%) 0 0,
            linear-gradient(-36deg, #9ac147 42.34%, transparent 42.34%) 100% 0,
            linear-gradient(-72deg, #639b47 75.48%, transparent 75.48%) 100% 0,
            linear-gradient(36deg, transparent 57.66%, #e1e23b 57.66%) 100% 100%,
            linear-gradient(72deg, transparent 24.52%, #f7941e 24.52%) 100%.........完整代码请登录后点击上方下载按钮下载查看