css布局帅哥侧面头部效果代码-html代码-BFW代码库

css布局帅哥侧面头部效果代码

代码语言：html

代码描述：css布局帅哥侧面头部效果代码

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

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

<head>

    <meta charset="UTF-8">





    <style>
        #canvas {
            background: transparent;
            margin-left: 270px;
            margin-top: -440px;
            z-index: 5;
            position: absolute;
        }
        #head {
            background: #f2e88f;
            height: 79px;
            width: 79px;
            border-radius: 50%;
            margin-left: 30px;
            margin-top: 50px;
            box-shadow: -11px 41px 0px -16px #f2e88f, 6px 65px 0px -16px #f2e88f, 4px 123px 0px -16px#f2e88f, 28px 162px 0px -20px #f2e88f, 40px 184px 0px -20px #f2e88f, 63px 222px 0px -20px #f2e88f, 45px 45px 0px 0px #f2e88f,67.5px 65px 0px 0px #f2e88f,75px 76px 0px 0px #f2e88f,79px 85px 0px 0px #f2e88f,85px 95px 0px 0px #f2e88f,163px 95px 0px 0px #f2e88f,163px 73px 0px 0px #f2e88f,165px 67px 0px 0px #f2e88f,156px 145px 0px 15px #f2e88f,95px 145px 0px 15px #f2e88f,38px 111px 0px 3px #f2e88f,70px 175px 0px 5px #f2e88f,152px 185px 0px 5px #f2e88f,
            -20px -60px 0px black, 30px -47px 0px 22px black,51px -59px 0px 22px black,83px -70px 0px 22px black,98px -70px 0px 22px black,130px -74px 0px 22px black,151px -69px 0px 22px black,165px -63px 0px 22px black,178px -50px 0px 22px black,186px -36px 0px 22px black, 189px -19px 0px 22px black,185px 7px 0px 22px black, 183px 40px 0px 15px black, 88px 34px 0px 22px #04181b,183px 77px 0px 15px black,-3px 14px 0px 10px orange,-4px 14px 0px 10px black,-6px 14px 0px 10px orange,-7px 14px 0px 10px black,-11px 14px 0px 10px orange,-11px 14px 0px 10px black;
        }
        #head::before {
            content: "";
            position: absolute;
            width: 16px;
            height: 32px;
            transform: rotate(-8deg);
            margin-top: 46px;
            margin-left: 3px;
            background: #f2e88f;
        }
        #head::after {
            content: "";
            position: absolute;
            width: 16px;
            height: 32px;
            transform: rotate(5deg);
            background: #f2e88f;
            margin-top: 119px;
            margin-left: 25px;
            box-shadow: 28px 45px 0px -1px #f2e88f;
        }
        #chin {
            width: 9.3px;
            height: 18.59px;
            background: #f2e88f;
            margin-top: 234px;
            position: absolute;
            margin-left: 75px;
            transform: rotate(-45deg)
        }
        #chin::before {
            content: "";
            position: absolute;
            width: 9.3px;
            height: 18.59px;
            background: #f2e88f;
            margin-top: 10px;
            margin-left: -2px;
            transform: rotate(25deg);
        }
        #chin::after {
            content: "";
            position: absolute;
            width: 18.2px;
            height: 34.31px;
            background: #f2e88f;.........完整代码请登录后点击上方下载按钮下载查看