html中相对定位和位移的区别,html5相对定位和绝对定位

导航：

• 1、html常用的三种定位是什么
• 2、在HTML中，三种定位的区别和含义分别是什么？
• 3、html中的相对定位和绝对定位的区别
• 4、HTML中DIV的相对定位与绝对定位
• 5、请问html4里的绝对定位和相对定位有什么区别?

html常用的三种定位是什么

在一般的前端开发中比较常用的定位有三种：相对定位，绝对定位，固定定位。

下面简要的说明一下他们的使用特点：

相对定位position:relative 1.它可以在四个方向分别或者同时进行偏移

2.定义时它的参照物是父元素（没有时为浏览器本身）

3.偏移后元素的原来位置还是被占着，并没有空出来

4.当父元素和子元素同时定义时，他们的参照物是父元素，且占据原来的位置

绝对定位position:absolute 1. 它可以在四个方向分别或者同时进行偏移

2.单独定义时它的参照物是浏览器本身，且不占据原来的位置

3.当父元素和子元素同时定义时，他们的参照物是父元素，且不占据原来的位置

4.当子元素绝对定位，父元素相对定位时，他们的参照物是父元素，且还占据原来的位置

5.当子元素相对定位，父元素绝对定位时，他们的参照物是父元素，且不占据原来的位置

固定定位position:fixed 1.它可以在四个方向分别或者同时进行偏移

2.定义时它总是以浏览器为参照物，且不占据原来的位置

3.它不会随着浏览器的滚动而移动，即会固定在所能到观察浏览器界面的固定地方

注：普遍使用方式为子绝父相，即子元素绝对定位，父元素相对定位

可以使用z-index: 来进行优先级显示

在HTML中，三种定位的区别和含义分别是什么？

一、相对定位 relative

1.参照物为自身html中相对定位和位移的区别；

2.相对定位只改变显示html中相对定位和位移的区别的位置html中相对定位和位移的区别，而不会改变占用的空间位置；

3.关于距离的正负值

二、绝对定位 absolute

1.参照物为具有定位属性的父元素。

PS:如果距离当前最近的父元素不具有定位属性html中相对定位和位移的区别，则会一层一层向外找，直到找到具有定位属性（这里仅要求三种定位属性任一都可）的父元素而进行定位，如果找到最后未能找到具有定位属性的父元素，de则最终会依照body进行定位。

2.绝对定位不仅会改变显示的位置，而且会改变占用的空间位置。就好比是元素处于一种悬空漂浮的状态，没有“肉体”html中相对定位和位移的区别！

3.关于距离的正负值，和上面的相对定位的性质一样。

三、固定定位 fixed

固定定位是将某个元素固定在浏览器的某个确定的位置，不随滚动条的移动而变化；   

固定定位的位置是  相对当前浏览器窗口  的；

html中的相对定位和绝对定位的区别

相对定位是指你的页面在项目中的位置；绝对定位是指存储在你电脑本的位置

HTML中DIV的相对定位与绝对定位

绝对定位（absolute）：

当一个DIV块的位置被定义为绝对定位的时候，也就意味着它失去了文档流的位置，后面的文档流会紧跟着补上来接替它的位置。如果上下左右的绝对偏移量都是零，那么它将漂浮在原来的位置上。否则就会以浏览器的上下左右四边为基准进行偏移。

相对定位（relative）:

当设了相对的偏移量之后，这个DIV原来所占据的位置（文档流）不会被下面的DIV块挤占，而是空在那里；当偏移后向下或者向右的内容会被隐藏，而 这一点区别于绝对定位，绝对定位会出现滚动条。但是向左或者向右的内容超出当前浏览器的视线，无论是相对还是觉得定位，超出的部分都会被隐藏。

注意，在使用相对定位时，无论是否进行移动，元素仍然占据原来的空间。因此，移动元素会导致它覆盖其它框。

绝对定位(absolute)：将被赋予此定位方法的对象从文档流中拖出，使用left，right，top，bottom等属性相对于其最接近的一个最有定位设置的父级对象进行绝对定位，如果对象的父级没有设置定位属性，即还是遵循HTML定位规则的，则依据body对象左上角作为参考进行定位。绝对定位对象可层叠，层叠顺序可通过z-index属性控制，z-index值为无单位的整数，大的在最上面，可以有负值(目前负值FF不支持)。

绝对定位使元素的位置与文档流无关，因此不占据空间。这一点与相对定位不同，相对定位实际上被看作普通流定位模型的一部分，因为元素的位置相对于它在普通流中的位置。

普通流中其它元素的布局就像绝对定位的元素不存在一样：

请问html4里的绝对定位和相对定位有什么区别?

从CSS的定义上看，绝对定位对象的position属性值为absolute，而相对定位的则为relative。绝对定位其实也可以说是相对定位，只不过它相对的参考对象为文档区域的左上角，而相对定位则是相对于当前对象的父对象。如果相对定位的对象的父对象是body，并且body的margin属性为0，则可以认为这时的相对定位的对象和绝对定位的对象在定位上是等同的。