left:0; right:0; top:0; bottom:0;居中

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
            #box{
                margin: 0 auto;
                width: 150px;
                height: 150px;
                border: 1px solid #FF0000;
                position: relative;
            }

#box #text{ width: 50px; height: 50px; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; } </style> </head> <body> <div id="box"> <div id="text"> 123 </div> </div> </body> </html>
left:0; right:0; top:0; bottom:0; margin:auto;会使text居中,如果text没有宽高,则会继承父集的宽高。适合body 内的遮罩,

猜你喜欢

转载自www.cnblogs.com/150536FBB/p/10524349.html
0
今日推荐