老师请检查，设置水平和垂直居中的两种方式是否都对？还有没有别的方法？

来源：2-5 编程练习

慕斯卡0165078

2020-03-28 09:22:56

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>CSS布局</title>
    <style type="text/css">
        .box{
            width: 500px;
            height: 200px;
            margin:0 auto;
            border:1px solid #aaa;
            background-color: #ababab;
            color: #fff;
            font-weight: bolder;
            position: relative;

        }
        .box div{
            width: 200px;
            height: 40px;
            font-size: 16px;
            text-align: center;
            /*background:blue;*/
            position:absolute;
            /*水平1*/
            left:150px;
            /*水平2*/
            /*left:50%;*/
            /*margin-left:-100px;*/
            /*垂直1*/
            top:80px;
            /*垂直2*/
            /*top:50%;*/
            /*margin-top:-20px;*/

        }
    </style>
</head>
<body>
    <div class="box">
        <div>
            欢迎大家来到慕课网学习！
            来到慕课网学习!
        </div>
    </div>
</body>
</html>