垂直居中

Posted 2021-01-13 150536fbb

         <style type="text/css">
            .box {
                background-color: blue;
            }
            .box1 {
                background-color: red;
                display: inline-block;
                vertical-align: middle;
                width: 200px;
                height: 200px;
            }        
            .box2 {
                background-color: yellow;
                display: inline-block;
                vertical-align: middle;
                width: 100px;
                height: 100px;
            }        
        </style>
        <div class="box">
            <div class="box1"></div>
            <div class="box2"></div>
        </div>