2.做练习弹框的练习

先思考,在看代码哦。

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        *{
            padding: 0;
            margin: 0;
        }
        html,body{
            width: 100%;
            height: 100%;
        }
     .box{
         position: fixed;
         top: 0;
         left: 0;
         bottom: 0;
         right: 0;
         background:rgba(0,0,0,0.5);
     }
      .son{
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%,-50%);
          background: white;
      }
    </style>
</head>
<body>
<div class="box">
    <div class="son">hello world</div>
</div>
</body>
</html>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

扫码关注云+社区

领取腾讯云代金券