美文网首页
2019-04-21

2019-04-21

作者: 蓝子_23d0 | 来源:发表于2019-04-21 12:23 被阅读0次

固定宽高块在浏览器中垂直居中

代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Demo</title>
    <style>
        html,body {
            height: 100%;
        }
       #box {
           position:absolute;
           left:50%;
           top:50%;
           margin-left:-150px;
           margin-top:-100px;
           border:1px solid red;
           background: #272626;
           width:300px;
           height:200px;
       }
    </style>
</head>
<body>
    <div id = "box">

    </div>
</body>
</html>

预览链接

相关文章

网友评论

      本文标题:2019-04-21

      本文链接:https://www.haomeiwen.com/subject/znwdgqtx.html