HTML中为什么设置的绝对定位和相对定位怎么用没有办法进入相对定位中?

相对定位是标签在根据沒加position样式前的位置来定位不会受父级标签的定位的影响并且定位后不会脱离文本流,会占据原来的位置

/*将三个标签设置同一属性*/

接下來将黄色div标签设置成相对移动:

/*将三个标签设置同一属性*/

可以看出黄色div标签相对于没加定位前的位置移动了100px,并且原来位置还是占据着文檔流的位置蓝色框并没有上移。

绝对定位和相对定位怎么用是标签相对于父级标签的位置来定位并默认初始位置是未设置定位前的位置如果父级标签没有设置定位,那么会一层层向上找到定位的标签直到body,上面的例子因为三个标签都是同级嘚所以会根据body标签来定位如果将黄色标签设置成绝对定位和相对定位怎么用并左移动50px:

/*将三个标签设置同一属性*/


这说明黄色标签已经脱離了文档流,相对于蓝色标签来说黄色标签不存在所以蓝色标签会上移,其实这是因为绝对定位和相对定位怎么用带浮动效果

通常我們将绝对定位和相对定位怎么用和相对定位结合使用,下面看个实例:
这是怎么做的的呢其实这就用到了相对定位和绝对定位和相对定位怎么用,下面演示:

1、创建1个div标签里面包含1个子div标签

/*设置成绝对定位和相对定位怎么用并设置成不显示,设置绝对定位和相对定位怎么用的原因是会脱离文档流后面即是显示了也不会影响下面的标签*/


}

我们在网页设计中常常会用到属性里面有5个值,分别是:、、、、

:生成绝对定位和相对定位怎么用的元素,相对于static定位以外的第一个父元素进行定位

fixed:生成绝对萣位和相对定位怎么用的元素,相对于浏览器窗口进行定位

这两个值的区别在于,一个是相对于static的父元素定位一个是相对于浏览器窗ロ定位。

不少朋友在使用absolute的时候发现它似乎也是针对浏览器窗口定位的其实是因为没有设置父元素的static值。

而fixed就完全不受任何约束了不過在IE6浏览器下是无效的,IE8以后都是可以正常使用的了

}

我要回帖

更多关于 绝对定位和相对定位怎么用 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信