position的属性值absolute的问题 财富值86

2016-10-13 20:21发布

第一个问题 position:absolute相对定位,定位对象是relative和fixed之间的区别。第二的问题 还有就是我分别设置了relative和fixed,在fixed替换成relative之后所设置的margin水平居中就失效了。
这是定为对象为relative的代码和效果图

<!DOCTYPE HTML> <html> <head>     <meta charset="UTF-8">     <title></title>             <style type="text/css">         .box {width:500px; height:300px; border:1px solid red; margin:50px auto 0;               position:relative;                 }         .content {width:300px; height:150px; border:2px solid blue; background:#ccc;                   position:absolute;                   left:30px;                   top:50px;         }     </style> </head> <body>     <div class="box">         <div class="content">             绝对定位         </div>     </div> </body> </html>

这是把父级框的position的属性relative替换为fixed之后的代码和效果图。

<!DOCTYPE HTML> <html> <head>     <meta charset="UTF-8">     <title></title>             <style type="text/css">         .box {width:500px; height:300px; border:1px solid red; margin:50px auto 0;               position:fixed;                 }         .content {width:300px; height:150px; border:2px solid blue; background:#ccc;                   position:absolute;                   left:30px;                   top:50px;         }     </style> </head> <body>     <div class="box">         <div class="content">             绝对定位         </div>     </div> </body> </html>

1条回答
mishen - whatsns产品经理
1楼 · 2016-10-13 20:37.采纳回答

用了定位后,是不能通过magrin:0 auto;来实现居中的。

一周热门 更多>