css绘制三位国王效果代码-html代码-BFW代码库

css绘制三位国王效果代码

代码语言：html

代码描述：css绘制三位国王效果代码

代码标签： css 国王

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1">



    <style>
        body {
          background: #cde;
        }
        
        .king {
          --gift: gold;
          --gift-contrast: orange;
          --eye: brown;
          --mouth: pink;
          --skin: #fca;
          --hair: #fff;
          --robe: #5c7;
          --robe-contrast: #294;
          --cape: #073;
          --cheek: #f003;
          width: 45vmin;
          height: 70vmin;
          position: absolute;
        }
        
        .king * {
          position: absolute;
          box-sizing: border-box;
        }
        
        .body {
          width: 65%;
          height: 70%;
          background:
            /* wrists */
            linear-gradient(20deg, #0000 10%, var(--cape) 0 90%, #0000 0) no-repeat 32% 48% / 10% 18%,
            linear-gradient(-20deg, #0000 10%, var(--cape) 0 90%, #0000 0) no-repeat 68% 48% / 10% 18%,
            /* buttons and middle decoration */
            radial-gradient(circle, var(--cape) 5%, #0000 0) repeat-y 50% 0% / 100% 10%,.........完整代码请登录后点击上方下载按钮下载查看