Rumah > Artikel > hujung hadapan web > html+css的垂直居中容器

html+css的垂直居中容器

php中世界最好的语言asal: 2018-03-12 16:39:221502semak imbas

这次给大家带来html+css的垂直居中容器，使用html+css的垂直居中容器的注意事项有哪些，下面就是实战案例，一起来看一下。

<!DOCTYPE html><html lang="en"><head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        *{            margin: 0;            padding: 0;
        }        .parent{            width: 400px;            height: 400px;            border:1px solid gray;            position: relative;
        }        .child{            width: 100px;            height: 100px;            top:0;            left:0;            right:0;            bottom:0;            margin:auto;            background: pink;            position: absolute;
        }    </style></head><body>
    <div class="parent">
        <div class="child"></div>
    </div></body></html>

相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！

Artikel berkaitan

Lihat lagi