css布局实现女生躺在床上看手机效果代码-html代码-BFW代码库

css布局实现女生躺在床上看手机效果代码

代码语言：html

代码描述：css布局实现女生躺在床上看手机效果代码

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

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

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

    <style>
        body {
      margin: 0;
    }
    
    .wrapper {
      display: flex;
      background: #3E0364;
      width: 100%;
      height: 100vh;
      overflow: hidden;
      font-family: Helvetica, sans serif;
      color: #ffffff99;
    }
    .wrapper .title {
      position: absolute;
      top: 10px;
      left: 20px;
      font-size: 16px;
      font-weight: 600;
      line-height: 20px;
      text-transform: uppercase;
      letter-spacing: 2px;
    }
    .wrapper .title div {
      background: #ffffff99;
      width: 20px;
      height: 2px;
      margin: 10px 0;
    }
    .wrapper .credit {
      position: absolute;
      bottom: 10px;
      right: 20px;
      font-weight: 300;
    }
    
    .artboard {
      position: relative;
      margin: auto;
      width: 80vmin;
      height: 80vmin;
    }
    .artboard div {
      box-sizing: border-box;
      position: absolute;
      background: #999;
    }
    
    #bed {
      width: 32vmin;
      height: 60vm.........完整代码请登录后点击上方下载按钮下载查看