div+css布局实现卡通混音调节器代码-html代码-BFW代码库

div+css布局实现卡通混音调节器代码

代码语言：html

代码描述：div+css布局实现卡通混音调节器代码

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

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

<head>
  <meta charset="UTF-8">
  

  
  
  
<style>
#mix {
  width: 350px;
  aspect-ratio: 1.3;
  border: 10px solid #4d2162;
  padding: 10px;
  box-sizing: border-box;
  border-radius: 20px;
  --c:/5% 5% linear-gradient(#9cd3fc 0 0);
  --p:/5% 6.5% radial-gradient(#9cd3fc 70%,#0000 72%);
  background:
    linear-gradient(#4d2162 0 0) 25% 16.5%/4% 3px,
    linear-gradient(#4d2162 0 0) 11.5% 12%/3px 5%,
    radial-gradient(#9cd3fc 55%,#4d2162 57% 70%,#0000 72%) 26% 12%/10% 13%,
    radial-gradient(#9cd3fc 55%,#4d2162 57% 70%,#0000 72%) 8% 12%/10% 13%,
    90% 19% var(--p),81% 19% var(--p),72% 19% var(--p),
    90% 8%  var(--p),81% 8%  var(--p),72% 8%  var(--p),
    repeating-linear-gradient(90deg,#ffc970 0 11%,#0000 0 15%) 50% 94%/90% 8%,
    repeating-linear-gradient(90deg,#ffc970 0 11%,#0000 0 15%) 50% 82%/90% 8%,
    58.5% 35% var(--c),53% 50% var(--c),47% 59% var(--c),41.5% 40% var(--c),
    repeating-linear-gradient(90deg,#4d2162 0 10%,#0000 0 25%) 52%.........完整代码请登录后点击上方下载按钮下载查看