css-doodle实现下雪景色动画效果代码

代码语言:html

所属分类:动画

代码描述:css-doodle实现下雪景色动画效果代码

代码标签: 景色 动画 效果

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

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

<head>
    <meta charset="UTF-8">
<style>
    html, body {   height: 100%;   margin: 0 }body {   display: grid;   place-content: center;   background: radial-gradient(#e4d8fb, #3F51B5) }@media screen and (max-width: 640px) {  css-doodle {    -webkit-transform: scale(.5);            transform: scale(.5);  }}  @media screen and (max-height: 640px) {  css-doodle {    -webkit-transform: scale(.5);            transform: scale(.5);  }  }
</style>
</head>

<body>
    <!-- partial:index.partial.html -->
    <css-doodle>:doodle { @grid: 126x1 / 650px; @shape: drop; background: @m2(radial-gradient(#fff 50%, transparent calc(50% + 1px)) @pn(200px 478px, 192px 469px) / @pn(80px 32px, 64px 32px) no-repeat), linear-gradient(10deg, #fff 26.5%, transparent calc(26.5% +
        1px)), linear-gradient(205deg, #5256bd 56%, #954ccc); } offset-path: path(' M @r650 600 Q @calc(@lr + @p(@r(-300, -20), @.........完整代码请登录后点击上方下载按钮下载查看

网友评论0