美文网首页css总结
css_居中:table

css_居中:table

作者: 壮壮成长记 | 来源:发表于2018-11-27 16:20 被阅读0次

-第一种方法

    <style type="text/css">
            * {
                margin: 0;
                padding: 0;
            }
            html,body{
                /* margin:0 auto; */
                height: 100%;
            }

            .parent {
                display: table;
                margin: 0 auto;
                position: absolute;
                top:0;left:0;right:0;bottom: 0;
                margin:auto;
            }

            .parent {
                width: 50%;
                height: 50%;
                background: #808080;
            }

            .child {
                display: table-cell;
            }

            .child {
                vertical-align: middle;
                text-align: center;
            }
            .child>span{
                width:100px;
                height:100px;
                background: #DAA520;
            }
        </style>
    </head>
    <body>
        <div class="parent">
            <div class="child"><span></span></div>
        </div>
    </body>

相关文章

网友评论

    本文标题:css_居中:table

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