css中的绝对定位和相对定位有什么区别?

html-css03

css中的绝对定位和相对定位有什么区别?,第1张

css中的绝对定位和相对定位的区别:

position: absolute,绝对定位。position: relative,相对定位。

position:absolute,float会隐式地改变display的类型(display:none除外)。即是当元素设置position:absolute、float:left、float:right中任意一个时,都会让元素以display:inline-block的方式显示(特点是:可以设置长宽,默认宽度不占满父元素)。

CSS:

层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。

相对定位是默认的定位方式。是相对于其他元素的一种定位方式,当附近有元素占据空间时,会根据当前元素的空间确定位置,会受到其他元素的影响。

绝对定位,是相对于父层及以上具有定位方式的元素进行定位,不受其他元素的影响。

区别如下:

1、相对定位的元素不会脱离文档流,占用文档流的空间,LeftRightTop和Bottom属性与margin属性混合使用会产生累加效果。

2、绝对定位的元素脱离文档流,偏移不影响文档流中的其它元素,LeftRightTop和Bottom属性与margin属性混合使用,偏移方向相同值累加,方向相反,margin属性值无效。

3、绝对定位的元素以最近的定位祖先元素为参照物。