div+css实现沙滩上海浪动画代码

代码语言:html

所属分类:动画

代码描述:div+css实现沙滩上海浪动画代码

代码标签: div css 沙滩 海浪 动画 代码

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

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum=1.0,minimum=1.0,user-scalable=0" />

     <style>
     /*
global
*/
*, *::before, *::after {
    margin: 0;
    padding: 0;
    border: 0;
    box-sizing: border-box;
}

*:focus {
    outline: none;
}

body {
    height: 100vh;
}

/*
beach
*/
@property --cp { syntax: '<percentage>'; inherits: false; initial-value: 100%; }

.beach {
    width: 100%;
    height: 100%;
    background: linear-gradient(
        to right,
        #004a44 0%,
        #03615b 5.26%,
        #0a6c66 10.53%,
        #027c73 15.79%,
        #028a7f 21.05%,
        #059c8e 26.32%,
        #39a997 31.58%,
        #4aae9f 36.84%,
        #84b7a2 42.11%,
        #b5aa8c 47.37%,
        #dbb89b 52.63%,
        #edc1a8 57.89%,
        #fed0b2 63.16%,
        #fddbc2 68.42%,
        #fedfc7 73.68%,
        #fe.........完整代码请登录后点击上方下载按钮下载查看

网友评论0