absolute的英文意思是绝对的意思,实际上是针对父级元素元素定位,如果父级元素没有position:relative|absolute,则追至再上一个父级元素,直至相对于文档的左上角定位，按照我们中国人的理解观念，这个其实是相对定位，是脱离文档流的。用了abolute属性，原有float属性将失效；
relative的英文意思是相对的意思，实际上是相对于对象当前位置的定位。而且是不脱离文档流的，就算用top、lef、bottom、right或margin将其移动位置，它也会在原来的文档流中占有自己实际大小的一块位置。
说白了，absolute是相对于父对象定位，relative是相对于当前位置定位！就是这么简单

关于absolute 和 relative 定位的定义的更多相关文章

  1. focus、click、blur、display、float、border、absolute、relative、fixed

    onfocus:获取焦点,点击时,按着不放 onclick:点击松开之后,未点击其他处 onblur:点击松开之后,又点击其他处 display:block,none,inline block:单独占 ...

  2. 定位 absolute和relative比较

    absolute:脱离原来位置定位.是相对于最近的有定位的父级进行定位;如果没有有定位的父级元素,就相对文档进行定位 relative:保留原来位置进行定位,相对于自己原来的位置进行定位 下面举两个例 ...

  3. Position属性四个值：static、fixed、absolute和relative的区别和用法

    Position属性四个值:static.fixed.absolute和relative的区别和用法 在用CSS+DIV进行布局的时候,一直对position的四个属性值relative,absolu ...

  4. position属性absolute与relative 详解

    最近一直在研究javascript脚本,熟悉DOM中CSS样式的各种定位属性,以前对这个属性不太了解,从网上找到两篇文章感觉讲得很透彻,收藏下来,唯恐忘记.一.解读absolute与relative ...

  5. position属性absolute和relative理解

    relative:相对于自身静态位置进行定位,不脱离流. absolute:绝对定位,脱离流,如果父元素定义了position属性,无论是absolute.relative还是fixed,都是相对于父 ...

  6. CSS+DIV布局中absolute和relative区别

    原文:http://developer.51cto.com/art/201009/225201.htm 这里向大家简单介绍一下CSS+DIV布局中absolute和relative属性的用法和区别,定 ...

  7. position的absolute与fixed，absolute与relative共同点与不同点

    absolute与fixed 共同点: (1) 改变行内元素的呈现方式,display被置为block: (2) 让元素脱离普通流,不占据空间: (3) 默认会覆盖到非定位元素上 不同点: absol ...

  8. CSS中position的absolute和relative用法

    static: HTML元素的默认定位方式 absolute: 将对象从文档流中拖出,使用left,right,top,bottom等属性进行绝对定位.而其层叠通过z-index属性定义.绝对定位的元 ...

  9. css中的position 的absolute和relative的区别（转）

    我们先来看看CSS3 Api中对position属性的相关定义: static:无特殊定位,对象遵循正常文档流.top,right,bottom,left等属性不会被应用. relative:对象遵循 ...

随机推荐

  1. iOS 多语言的切换

    一.添加应用程序需要支持的国际语言 二.新建一个Localizable.strings文件,作为多语言对应的词典,存储多种语言 三.在Localizable.strings的对应文件以键值对的形式配置 ...

  2. Django（二）

    一.路由系统,URL    1.url(r'^index/', views.index),            url(r'^home/', views.Home.as_view()),    2. ...

  3. js+jquery的等价用法

    js: 获取属性的值: document.getElementById("id").value; 设置属性的样式: document.getElementById("id ...

  4. webpack配置技巧--路径

    resolve: { extensions: ['', '.js', '.vue'], fallback: [path.join(__dirname, '../node_modules')], ali ...

  5. 山东省第七届ACM省赛------The Binding of Isaac

    The Binding of Isaac Time Limit: 2000MS Memory limit: 65536K 题目描述 Ok, now I will introduce this game ...

  6. python之禅

    >>> import this The Zen of Python, by Tim Peters Beautiful is better than ugly. Explicit is ...

  7. 如何在R语言中使用Logistic回归模型

    在日常学习或工作中经常会使用线性回归模型对某一事物进行预测,例如预测房价.身高.GDP.学生成绩等,发现这些被预测的变量都属于连续型变量.然而有些情况下,被预测变量可能是二元变量,即成功或失败.流失或 ...

  8. 关于 OJ1575的参考题解

    #include <stdio.h>int main(){ int a,b; scanf("%d",&a); b=0; while(a) { b+=a%10; ...

  9. 美国 ZIP Code 一览表

    今天给大家提供美国的Zip Code的原因是大家在注册国外的账号时,需要提供这个Zip Code,因为一般美国的服务默认是面向美国的,甚至是仅支持美国. 以下提供一些美国的zip code 列表. 邮 ...

  10. service&thread

    service:在后台静默运行.服务必须在一个线程中才能运行.长时间的在后台运行,而且不需要交互的情况下,使用服务. thread:在后台运行,但是可以与用户进行相应的交互操作.比如说,音乐播放器,后 ...