js+css布局实现逼真两个开关代码-html代码-BFW代码库

js+css布局实现逼真两个开关代码

代码语言：html

代码描述：js+css布局实现逼真两个开关代码

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

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
    @import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@500;600;700&family=Poppins:wght@400;500;600&display=swap');

:root{
  --olive-leaf: #606c38;
  --black-forest: #283618;
  --cornsilk: #fefae0;
  --sunlit-clay: #dda15e;
  --copperwood: #bc6c25;
  --off-text: #151C0D;
  --cool-glow-bright: #8ea159;
}

*{ box-sizing:border-box; }

html{
  height:100%;
}

body{
  min-height:100%;
  margin:0;
  background:
    radial-gradient(circle at 30% 20%, rgba(96,108,56,.4), transparent 55%),
    radial-gradient(circle at 75% 80%, rgba(188,108,37,.2), transparent 50%),
    var(--black-forest);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow-y:auto;
  overflow-x:hidden;
  padding: 24px;
  font-family:'Poppins', sans-serif;
}

body::before.........完整代码请登录后点击上方下载按钮下载查看