position: absolute 如果不设置left, right, top, bottom会在什么位置

【position: absolute 如果不设置left, right, top, bottom会在什么位置】的更多相关文章

position: absolute 如果不设置left, right, top, bottom会在什么位置

一般我们设置position: absolute都会一起设置left/right/top/bottom, 但是如果不设置, 布局会是什么样子的呢? 直接上图 1.一个大盒子中4个小盒子, 正常文档流布局(红色盒子等下设置position:absolute) 2. 将3号盒子设置position: absolute 可以看到, 3号盒子脱落了文档流, 4号盒子上来到了3号盒子原来的位置, 但是3号盒子还在之前文档流的位置, 向下偏移一点是因为margin的折叠效应, 脱离文档流后,3号盒子marg…

关于position:absolute的困惑

今天在学习<精通css>时碰到一个问题,第六章“对列表应用样式和创建导航条”中的“Suckerfish下拉菜单”中,为了创建导航条的下拉菜单,文中提到的方法是:先设置下拉菜单的position:absolute(注意:此时父级并没有设置position),然后用left:-999em将下拉菜单隐藏到屏幕左边,然后在父列表项中添加鼠标悬停伪选择器,ul li:hover ul{left:auto},这样,当鼠标移动到父列表项时,就会在合适的位置出现下拉菜单. html: <ul class…

通过案例理解position:relative和position:absolute

w3school过了HTML的知识之后,觉得要自己单纯地去啃知识点有点枯燥,然后自己也很容易忘记,所以便找具体的网站练手便补上不懂的知识点.position:relative和postion:absolute困扰了我快一个星期之久,网上找到的资料鱼龙混杂,刚确定“这样”的理解之后,看另一份资料,发现“这样”理解是错了,就这样不断更正,并记录下来,最终整理出这份,以备参阅. 若有错误,请指正. 下面的结果都是基于firefox38版本来测试的. position:relative相对定位 1. 如…

CSS--position:relative和position:absolute

position:relative相对定位 1. 如何定位?每个元素在页面的普通流中会“占有”一个位置,这个位置可以理解为默认值,而相对定位就是将元素偏离元素的默认位置,但普通流中依然保持着原有的默认位置.(在父级节点的content-box区定位,父级节点有文字的话,元素的默认位置则是紧随文字)2. 不会改变行内元素的display属性.3. 并没有脱离普通流,只是视觉上发生的偏移.代码—— <body style='margin:0;padding:0;background:#BDD7EE;…