flex 方法上下左右居中 子元素无宽高 

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">
            *{
                margin: 0 ;
                padding: 0;
            }
        span{
            border: 1px solid #333;
        }
        div{
                display: flex;
                justify-content:center;/*x轴对齐方式*/
                align-items:center;     /*y轴对滴方式*/
                height: 100vh;        /**屏幕高度百分百*/
        }        
    </style>
</head>
<body>
    <div><span>内容所在区域</span></div>
</body>
</html>

 

posted @ 2017-06-02 14:52  Jinsuo  阅读(4970)  评论(0)  编辑  收藏  举报