单个div+css布局绘制西装革履的绅士男人形象代码

代码语言:html

所属分类:布局界面

代码描述:单个div+css布局绘制西装革履的绅士男人形象代码

代码标签: 单个 div css 布局 绘制 西装革履 绅士 男人 形象 代码

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

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

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

  
  
<style>
#gentleman {
  width: 182px;
  height: 350px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background:
    /* Hairs */ conic-gradient(
        from 0 at 0 15px,
        transparent 80deg,
        #000 80deg
      )
      34px 0 / 82px 38px,
    conic-gradient(
        from 180deg at 100% 24px,
        transparent 10deg,
        #000 10deg 138deg,
        transparent 138deg
      )
      115px 0 / 22px 122px,
    conic-gradient(
        from 0 at 0 20px,
        transparent 30deg,
        #000 30deg 162deg,
        transparent 162deg
      )
      22px 15px / 18px 62px,
    /* Face Shadow */
      conic-gradient(from 90deg at 0 0, #000 74deg, transparent 74deg) 42px
      100px / 60px 60px,
    /* Neck */
      conic-gradient(
        from 0 at 0 100%,
        #000 12deg,
        #f23b23 12deg 34deg,
        #fff 34deg
      )
      102px 128px / 18px 60px,
    conic-gradient(
        from -90deg at 17px 100%,
        transparent 47deg,
        #000 47deg 148deg,
        transparent 148deg
      )
      60px 160px / 42px 44px,
    /* Ears */
      conic-gradient(from -55deg at 8px 100%, #f23b23 88deg, transparent 88deg)
      120px 76px / 2.........完整代码请登录后点击上方下载按钮下载查看

网友评论0