单个div+css实现一幅超现实主义的画作代码-html代码-BFW代码库

单个div+css实现一幅超现实主义的画作代码

代码语言：html

代码描述：单个div+css实现一幅超现实主义的画作代码

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/reset.min.css">


    <style>
        #wonder {
          box-sizing: border-box;
          min-height: 400px;
          height: 100vh;
          position: relative;
          overflow: hidden;
          background: radial-gradient(circle, white 60%, rgba(255,255,255,0) 75%) 70% 10%/4em 4em, radial-gradient(ellipse, #ff69b4 10%, rgba(255,105,180,0) 70%) calc(50% - 12em) calc(50% - 4em)/4em 2em, radial-gradient(circle, #ff69b4 10%, rgba(255,105,180,0) 60%) calc(50% - 11em) calc(50% - 4.5em)/3em 3em, radial-gradient(circle, #ff69b4 10%, rgba(255,105,180,0) 60%) calc(50% - 10em) calc(50% - 5.5em)/4em 4em, radial-gradient(circle, #ff69b4 10%, rgba(255,105,180,0) 60%) calc(50% - 9em) calc(50% - 5em)/3em 3em, radial-gradient(circle, #ff69b4 10%, rgba(255,105,180,0) 60%) calc(50% - 8.5em) calc(50% - 4em)/4.5em 4.5em, radial-gradient(circle, #ff69b4 10%, rgba(255,105,180,0) 60%) calc(50% - 10.4em) calc(50% - 3.5em)/3.7em 3.7em, radial-gradient(ellipse, #ff69b4 10%, rgba(255,105,180,0) 60%) calc(50% - 7em) calc(50% - 4em)/4em 2.5em, radial-gradient(ellipse, #ff69b4 10%, rgba(255,105,180,0) 60%) calc(50% + 8.5em) calc(50% - 0.5em)/4.5em 2.5em, radial-gradient(circle, #ff69b4 10%, rgba(255,105,180,0) 60%) calc(50% + 10em) calc(50% - 1.2em)/4em 4em, radial-gradient(circle, #ff69b4 10%, rgba(255,105,180,0) 60%) calc(50% + 11em) calc(50% - 2.4em)/3em 3em, radial-gradient(circle, #ff69b4 10%, rgba(255,105,180,0) 60%) calc.........完整代码请登录后点击上方下载按钮下载查看